概要
JavaScriptを使用して開発をしている際に、配列でよく使用する関数を項目ごとにまとめました。
各例のトップレベルで下記のコードが定義されている事を前提とします。
var arr = [1, 2, 3, 4, 5];
要素の追加・削除
pop()/push()
pop(): 配列の最後の要素を削除し、その要素を返します。
push(): 配列の最後に要素を追加し、新しい配列の要素数を返します。
arr.push(6);
console.log(arr); //=> [1, 2, 3, 4, 5, 6]
arr.pop(6);
console.log(arr); //=> [1, 2, 3, 4, 5]
shift()/unshift()
shift(): 配列の先頭の要素を削除し、その要素を返します。
unshift(): 配列の先頭に要素を追加し、新しい配列の要素数を返します。
arr.unshift(0);
console.log(arr); //=> [0, 1, 2, 3, 4, 5]
arr.shift();
console.log(arr); //=> [1, 2, 3, 4, 5]
slice()
配列内の一部を切り取り、新しい配列として返します。
let a4 = arr.slice(0, 3);
console.log(a4); //=> [1, 2, 3]
splice()
古い要素の削除しながら、新しい要素を追加することで、配列の内容を変更します。
基本Syntax
array.splice(index, howMany, Elements)
/**
index: 配列の変更を開始するインデックスを指定します。
howMany: 削除する古い配列要素の数を指定します。
Elements: 追加する要素、または配列を指定します。
**/
var months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// インデックス1の0個の要素を入れ替える(インデックス1の場所に要素を追加)
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'June']
months.splice(4, 1, 'May');
// インデックス4つ目の1つの要素を入れ替える。
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'May']
concat()
2つ以上の配列を組み合わせ、組み合わせた配列を返します。
let a1 = arr.concat([6, 7]);
console.log(a1); //=> [1, 2, 3, 4, 5, 6, 7]
要素の繰り返し
forEach()
与えられた関数を、配列の各要素に対して一度ずつ実行します。
function repeat(ele) {
console.log(ele);
}
arr.forEach(repeat); //=> 1 2 3 4 5
配列内での検索
indexOf()
指定されたインデックスの位置にある要素を返す。
見つからなければ-1を返します。
console.log(arr.indexOf(0)) //=> 1
console.log(arr.indexOf(10)) //=> -1
find()/findIndex()
提供されたテスト関数を満たす配列内の 最初の要素の
値を返します。
console.log(arr.find(num => num > 2)); //=> 3
console.log(arr.findIndex(num => num > 2)); //=> 2
includes()
配列が渡された要素を持つかどうか判定します。
console.log(arr.includes(2)); //=> true
filter()
テスト関数を配列の各要素に対して実行し、それに合格した全ての要素からなる新しい配列を返します。
let a2 = arr.filter(num => num > 3);
console.log(a2); //=> [4, 5]
配列を変換する
map()
与えられた関数を配列のすべての要素に対して呼び出し、その結果からなる新しい配列を生成します。
a3 = arr.map(ele => ele - 1);
console.log(a3); //=> [0, 1, 2, 3, 4]
sort()
配列内の要素を並び替えます。
let array = [4, 2, 3, 4, 5, 6, 7];
console.log(array.sort()); //=> [2, 3, 4, 4, 5, 6, 7]
reverse()
配列内の要素の順序を反対にします。
console.log(arr.reverse()) //=> [5, 4, 3, 2, 1];
reduce()
配列の各要素に対して（引数で与えられた）関数を実行して、単一の値にします。
基本Syntax
let value = arr.reduce(function(accumulator, currentItem, index, array) {
// ...
}, initial);
-
accumulator: それまでの値の累積値 -
currentItem: 現在値 -
index: 現在のインデックス -
array: ソースの配列
let result = arr.reduce((sum, current) => sum + current, 0);
console.log(result); //=> 15