JavaScriptのreduceについて
reduce
関数は、配列内の各要素を一つの値にまとめたい場合などに使用します。
合計値を出したり、文字列を繋げたり、オブジェクトに格納したりできます。
構文
/** * const result = array.reduce((現在の累積値, 処理中の要素, 処理中のインデックス, 対象のarray) => { * return 次の値; * }, 初期値); */ const resulet = array.reduce((accumulator, currentValue, index, array) => { return nextValue; }, initialValue);
index
、array
、initialValue
は省略可能です。
初期値initialValue
が省略された場合、配列の最初の値を初期値として扱います。
初期値が省略された場合、index
は1
からになります。(0は初期値になるため)
よくある使用例
合計値を出す
const numList = [1, 2, 3, 4, 5]; const result = numList.reduce((acc, value) => { return acc + value; }); console.log(result); // 15 const result2 = numList.reduce((acc, value) => { return acc + value; }, 2); console.log(result2); // 17
文字列を繋げる
const strList = ['あ', 'い', 'う', 'え' , 'お']; const result = strList.reduce((acc, value) => { return acc + value; }); console.log(result); // あいうえお const result2 = strList.reduce((acc, value) => { return acc + value; }, 2); console.log(result2); // 2あいうえお
オブジェクトを加工してまとめる
const data = [ {name: 'ichiro', year: 2001}, {name: 'jiro', year: 2002}, {name: 'saburo', year: 2003} ]; const result = data.reduce((acc, value) => { acc[value.name] = value.year; return acc; }, {}); console.log(result); // {ichiro: 2001, jiro: 2002, saburo: 2003}