Tips
今日の開発Tips（2025-06-12）
JavaScriptの`reduce`メソッドは、配列の要素を累積的に処理し、単一の値を返す強力なツールです。 複雑な配列操作を簡潔に記述でき、可読性も向上します。 特に、配列の要素を合計したり、オブジェクトを結合したりする際に非常に便利です。
配列要素の累積処理：reduceメソッド
reduceメソッドは、配列の各要素と累積値に対してコールバック関数を適用し、最終的な累積値を返します。 第2引数は初期値を指定できます。
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // 0 は初期値
console.log(sum); // 15
const objects = [{name: 'a', value: 1}, {name: 'b', value: 2}];
const combinedObject = objects.reduce((acc, obj) => ({...acc, ...obj}), {});
console.log(combinedObject); // {name: 'b', value: 2} (最後のオブジェクトのプロパティが優先されることに注意)
const strings = ['a', 'b', 'c'];
const concatenatedString = strings.reduce((acc, str) => acc + str, '');
console.log(concatenatedString); // abc注意点：初期値を省略すると、配列の最初の要素が初期値として使われ、処理は2番目の要素から開始されます。空の配列に対してreduceを実行する場合、初期値を必ず指定してください。 また、reduceのコールバック関数の戻り値の型は、最終的な結果の型になります。 オブジェクトを結合する場合は、オブジェクトのキーが重複する可能性に注意し、必要に応じて処理を調整する必要があります。