よく使うarrayですが、改めて勉強します。
array(配列)
arrayとはデータ（プリミティブまたはオブジェクトのどちらか）が順序付けされて集まったものです。
const testArray = [1, 2, 3, 4, 5];
要素を取り出す
配列の先頭の値
配列の末尾の値
const lastNum = testArray.length - 1;
console.log(testArray[lastNum]); //配列の最後の値
値を追加する(push,unshift)
- 末尾に値を追加する
testArray.push(6);
- 先頭に追加する
testArray.unshift(0);
値を消す(shift,splice,pop)
- 先頭の値を消す
console.shift(testArray);
- 特定の値を消したい場合
array.splice(2, 1); //配列の2番目の値を1つ削除する
- 末尾の値を消す
testArray.pop();
map(要素ひとつひとつを取り出す)
arrayのオブジェクトはmap関数を持っています。
const testArray = [1, 2, 3, 4, 5];
testArray.map((elem ,index) => elem);
// [1, 2, 3, 4, 5]
↑要素ひとつひとつを取り出して、最後はarrayを返してくれます。
確認
arrayで返す時に文字列を追加することもできる
[1,2,3].map((elem, index) => {
const key = `property${elem}`; //一度keyという名前で文字列を追加しから
return {[key]: elem} //arrayに返す！
});
確認
注意
一度変数に入れずにarrayに追加しようとするとerrorになりました。
some(true / falseを返す)
some()は、配列のいずれかの要素が指定した条件を満たしているか否かをtrue / false で返すメソッドです。
1つでも条件を満たしている要素があれば、trueを返します。
任意の値が含まれていたら即座に処理が終わります。
[1,2,3,4,3].some(elem => elem === 3) // ３がきたらtrueを返し、即処理終了
// もっと基礎的に書くと...
const test = [1,2,3,4,5];
const exists =test.includes(3); //3がtestの配列の中にあればtrue!
console.log(exists); // => true
↑これで実行するとtrueが返ってくる
やってみた
どの値にも一致しなかった場合は、最後まで比較したあと、falseを返します。
これのメリットは、左から数えて1番最初の3が来た時にすぐに処理が終わることです。
パフォーマンスを意識したいときなどによく使います。
includes(true / falseを返す)
includesは特定の要素が配列に含まれているかどうかをtrue / false で返します。
const test = [1,2,3,4,5];
test.includes(5); // ture
test.includes(10); //false
やってみた
slice(指定した部分の配列の一部をコピーして、新しい配列を返す )
slice() メソッドは begin から end まで選択された配列の一部をシャローコピーして、新しい配列オブジェクトを返します (end は含まれません)。元の配列は変更されません。
const test = ['a', 'b', 'c', 'd', 'e'];
const sliceArr = test.slice(0, 1); // ['a']
const sliceArr_2 = test.slice(0, 2); // ['a', 'b']
const sliceArr_3 = test.slice(2, 3); // ['c']
やってみた
fillter(条件に一致した値のみを抽出する)
配列からある特定の条件下で条件に一致した値のみを抽出して、配列を返します。
一致しなかったものは配列には含まれません。
const test = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const filterArr =test.filter(elem => elem > 1);
console.log(filterArr ); //[2, 3, 4, 5, 6, 7, 8, 9, 10]
// もっと基礎的に書くと...
const fillterArr_2 = test.filter(function( value ) {
return value < 5; //5よりも小さい数値だけを抽出
});
console.log(fillterArr_2 ); //[1, 2, 3, 4,]
やってみた
連想配列の配列の要素を条件にする場合
const arr2 = [
{ id: 1, name: 'test', height: 160},
{ id: 2, name: 'testさん', height: 170},
{ id: 3, name: 'test君', height: 180},
{ id: 4, name: 'testちゃん', height: 190}
];
// heightが１８０以上を抽出したい場合
const filterArr2 = arr2.filter(elem => elem.height >= 180); // id: 3、４が取れるはず
やってみた
