主な内容の要点
JavaScriptで配列の合計を出すときは、reduceメソッドを使うのが便利です。配列の要素を順番に処理して、最終的に1つの値（合計など）を返してくれます。
reduceメソッドの基本
- 書き方：
配列.reduce((合計値を入れる変数, 要素の値) => {
return 合計値を入れる変数 + 要素の値;
}, 初期値);
- 初期値を指定すると、最初の合計値にその値が入ります。
（例：0を指定すれば「0から足し算スタート」）
具体例
let numbers = [48, 75, 92, 61, 54, 83, 76];
let total = numbers.reduce((sum, element) => sum + element, 0);
console.log(total); // 489
sumが合計を保持する変数elementが配列の各要素- 最後に
489が返る
オブジェクト配列の場合
配列の中身がオブジェクトでもOK。例えば「点数を持つ生徒のリスト」から合計点を出すこともできます。
let users = [
{ name: 'Yamada', result: 75 },
{ name: 'Suzuki', result: 91 },
{ name: 'Kudou', result: 80 }
];
let total = users.reduce((sum, user) => sum + user.result, 0);
console.log(total); // 246
注意点
- 初期値を省略すると、配列の最初の要素が初期値として使われます。
→ 数値配列なら問題ないけど、オブジェクト配列だと意図しない動作になるので、必ず初期値を指定するのがおすすめです。 reduceは「合計」以外にも「最大値を探す」「文字列を連結する」など、配列を1つの値にまとめたいとき全般に使える便利なメソッドです。
初心者向け “使うときのポイント”
- 配列の値を全部足したいときには「for-loop（for文）で１つずつ足す」でもいいけれど、
reduceを使えばコードがスッキリする。 reduceを使うとき 必ず 「累積値（sum 等）」と「現在の要素（element 等）」を引数に取るコールバック関数を用意する。- 初期値（多くの場合 0）を指定しておくと安心。特に「数値＋オブジェクト」など混在した配列の場合など。
- コールバック関数は 返り値が次の累積値になる という点をイメージしておく。
- 要素がオブジェクトなら「どのプロパティを合計するか」を明示的に指定しよう。
👉 まとめると、配列の合計を出すなら reduce を使い、初期値をしっかり指定するのが基本です。
初心者のうちは「reduce = 配列をまとめる道具」と覚えると理解しやすいです。