JavaScript reduce関数を使用して合計を求める
2018.08.13
ふっくん
こんにちは。ふっくんです。
今回は、 javascript の reduce 関数をご紹介します。
reduce関数の使い方
reduce関数とはどのようなものかと言うと、配列の各要素に対して（左から右へ）関数を適用し、単一の値にします。
例えば、以下のような連想配列があるとしましょう。
const fruits = [
{'id': 1, 'kind': 'apple', 'price': 100},
{'id': 2, 'kind': 'orange', 'price': 80},
{'id': 3, 'kind': 'grape', 'price': 200},
]fruits の中から price の合計値を求めたい時に reduce を使用します。
const total = fruits.reduce((p, x) => p + x.price, 0)出力結果
380ソースコードの解説をしておきます。
- reduce関数内の
pxは任意の文字で構いません。 - 一番後ろにある
0は初期値です。ここで初期値を設定します。 p + x.priceの計算を行い、これを配列の要素の数だけ行います。pには前回のコールバックの戻り値が入ります。また、最初の要素のみ初期値が入ります。
つまり、上記の例だと以下のように計算が行われます。
0 + 100
100 + 80
180 + 200
// 出力 380非常に便利な関数ですので、ぜひ使用してみてください。 他にもjavaScriptの便利な関数を紹介していますので、ぜひご覧ください！
