webMemo

筋トレ好きな駆け出しフロントエンドエンジニアの勉強メモ

JSのreduceについて

reduceについて

配列データに対して、任意のコールバック関数を実行できる

reduceのコールバック関数には4つの引数を取れる

const aaa =[1,2,3,4,5];
const bbb = aaa.reduce(function (prev,value,index,array) {
  console.log('前回の値='+prev);
  console.log('現在の値='+value);
  console.log('インデックス='+index);
  console.log('配列='+array);
  return prev+value;
});

console.log('結果='+bbb);
  • 1 prev= 前回の値
  • 1 value = 現在の値
  • 2 index= 配列のindex番号
  • 3 array= 配列そのもの

結果

前回の値=1
今回の値=2
インデックス=1
配列=1,2,3,4,5
前回の値=3
今回の値=3
インデックス=2
配列=1,2,3,4,5
前回の値=6
今回の値=4
インデックス=3
配列=1,2,3,4,5
前回の値=10
今回の値=5
インデックス=4
配列=1,2,3,4,5
結果=15

表示の値が配列の2から始まっている。

初期値を設定できる

array.reduce(function (prev,value,index,array){
 〜
},初期値);

先ほどの配列に初期値「0」を設定してみる

前回の値=0
現在の値=1
インデックス=0
配列=1,2,3,4,5
前回の値=1
現在の値=2
インデックス=1
配列=1,2,3,4,5
前回の値=3
現在の値=3
インデックス=2
配列=1,2,3,4,5
前回の値=6
現在の値=4
インデックス=3
配列=1,2,3,4,5
前回の値=10
現在の値=5
インデックス=4
配列=1,2,3,4,5
結果=15

表示の値が配列の1から始めることができた。