【JavaScript】reduceメソッド

はじめに

こんにちは。
JavaScriptのreduceメソッドについてアウトプットしていきます！

reduceメソッドとは

reduce() メソッドは、配列の各要素に対して (引数で与えられた) reducer 関数を実行して、単一の出力値を生成します。

参照：https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

JavaScript

const numbers = [1,2,3,4];

const result = numbers.reduce((accu,curr) => {
  return accu + curr;
})

console.log(result);  //10

上記の記述では、1回目の処理でaccuには配列の最初の要素の1が入る。currには2が入る。2回目の処理でaccuにはreturnで返された3が入り、currには配列の3が入る。

処理が完了すると、resultから配列の合計10が出力される。

mapメソッドとの違い

reduceメソッドと同じように、配列に対して処理ができるmapメソッドについても簡単に説明していきます。

mapメソッドとは

map() メソッドは、与えられた関数を配列のすべての要素に対して呼び出し、その結果からなる新しい配列を生成します。

参照：https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/map

JavaScript

const numbers = [1,2,3,4];

const result = numbers.map((num) => {
  return num + 2;
})

console.log(result);  //[3, 4, 5, 6]

配列の要素全てに+2を実行して、新しい配列を生成できます。

最後に

ここまでreduceメソッドについてまとめてみました。
できることが少しずつ増えてきてプログラミングの楽しさが増してきました笑
これからもコツコツ学習していきます！