javascript(ES2015) - 配列

配列

配列要素の操作

配列の最後の要素にアクセス

let array = ["a","b","c","d"]; 
array[array.length - 1]; 

最後に要素を追加(push)

array.push("e"); //["a","b","c","d","e"]

最後の要素を削除(pop)

array.pop(); //["a","b","c","d"]

先頭の要素を追加(unshift)

array.unshift("0"); //["0","a","b","c","d"]

先頭の要素を削除(shift)

array.shift(); //["a","b","c","d"]

配列の結合(concat)

let array1 = ["a","b","c"];
let array2 = array1.concat("4","5","6");
console.log(array2); //["a", "b", "c", "4", "5", "6"]

配列の一部分を取得(slice)

let array1 = ["a","b","c","d","e","f"];
let array2 = array1.slice(3); //3番目(4番目)から最後までの要素を取得。第2引数を省略すると最後まで取得
let array3 = array1.slice(2,4); //2番目から3番目の一つ前の要素を取得

console.log(array2);　//["d", "e", "f"]
console.log(array3); //["c", "d"]

配列の任意の場所を書き換える(splice)

• 第一引数：変更を開始する配列の位置
• 第二引数：削除する要素の数(0を指定で要素を削除しない)
• 第三引数：追加する要素を探す

let array1 = ["a","b","c","d","e","f"];
let array2 = array1.splice(2,0,"1","2","3"); //2番目の位置から["1","2,"3"]を追加

console.log(array1);　　//["a", "b", "1", "2", "3", "c", "d", "e", "f"]

array2 = array1.splice(2,3); //2番目から3つの要素を削除
console.log(array1);　//["a", "b", "c", "d", "e", "f"]
console.log(array2); //["1", "2", "3"] 削除した要素を配列に格納してる

配列内の要素の削除や置換(copyWithin)

• 第一引数：配列のどこにコピーするかの場所
• 第二引数：コピーを開始する場所
• 第三引数：コピーを終了する場所

let array1 = ["1","2","3","4","5"];
let array2 = array1.copyWithin(1,2); //1番目の位置から置き換える。2番目から最後の要素までコピーする

console.log(array1);　　//["1", "3", "4", "5", "5"]

let array3 = array1.copyWithin(2,0,2); //2番目から書き換える。0番目から2番目までコピーする
console.log(array3);　　//["1", "3", "1", "3", "5"]

配列を特定の値で埋める

let array1 = new Array(5).fill("a"); //大きさ5の配列を作成して全部の要素をaに指定する。
console.log(array1);  //["a", "a", "a", "a", "a"]

配列の各要素に対して同じ処理を行う。配列の高速列挙 - forEach()

構文

array.forEach(function (value, index, array) {
  // 配列の各要素に対する処理
});
//value：現在処理されている配列の中身の値
//index：何番目の値が処理されているのかを示す値
//処理している配列

let array1 = ["1","2","3","4","5"];
array1.forEach(function (value, index, array) {
  console.log(array + "の"　+ index + "番目の値は："　+ value);
});

配列の要素すべてに対して、同じ処理を適用した新しい配列を生成する - map()

構文

var newArray = array.map(function (value, index, array) {
  // 配列の各要素に対する処理
  return newValue;
});

例：配列の中の要素を2倍にする

function twice(value) {
  return value * 2;
}

var array1 = [1,2,3,4];
var arrayTwice = array1.map(twice);
console.log(arrayTwice); //[2, 4, 6, 8]
console.log(array1); //[1, 2, 3, 4]

配列の中から条件に一致する要素をフィルタリングした新しい配列を生成する - filter()

例：偶数の値のみを残した配列を生成

function even(value) {
  return value % 2 == 0;
}
var array2 = [1, 2, 3, 4, 5];
var evens = array2.filter(even);
console.log(evens); //[2, 4]

配列の中から一つの値を求める - reduce()

構文

var result = array.reduce(function (previous, current, index, array) {
  return previousとcurrentに対する処理;
}, initial);

//previous：前回の処理結果の値
//current：現在入れられている値
//initail：初期値

例　：配列の合計値を求める

function add(a,b){
  return a + b ; 
}

var array3 = [1,3,5,7,9];
var adds = array3.reduce(add);
console.log(adds); //25