【JavaScript】コールバック関数と初期値を使って配列の値を累積する自作reduce関数

問題

JavaScriptで、配列・コールバック関数・初期値の3つを引数として受け取る関数を作成します。この関数は、配列を反復処理しながら値を累積していき、最終的な結果を返す必要があります。つまり、標準の Array.prototype.reduce() と同じ動作を独自に実装することが求められます。

コード例

以下がその実装コードです。

const arr = [1, 2, 3, 4, 5];
const sum = (a, b) => a + b;

Array.prototype.customReduce = function(callback, initial){
    // 初期値が指定されていない場合は、配列の先頭要素を初期値とする
    if(!initial){
        initial = this[0];
    };
    let res = initial;

    // 先頭要素を初期値に使った場合はインデックス1から、
    // そうでなければインデックス0からループを開始する
    for(let i = initial === this[0] ? 1 : 0; i < this.length; i++){
        res = callback(res, this[i]);
    };
    return res;
};

console.log(arr.customReduce(sum, 0));

出力結果

コンソールには以下のように出力されます。

15

コードの解説

この customReduce メソッドの動作は次の流れになっています。

1. 初期値の判定： 引数 initial が渡されていない場合（falsyな値の場合）は、配列の最初の要素 this[0] を初期値として代用します。
2. 累積変数の準備： 変数 res に初期値を代入し、ここに結果を蓄えていきます。
3. ループの開始位置の調整： 初期値として先頭要素を使った場合は、その要素を二重に計算しないようインデックス 1 からループを開始します。初期値が明示的に渡された場合は、インデックス 0 からすべての要素を処理します。
4. 累積処理： 各反復ごとにコールバック関数を呼び出し、直前までの累積値と現在の要素を渡します。その戻り値が新しい累積値となります。
5. 結果の返却： ループが完了した時点の res を最終結果として返します。

この例では、配列 [1, 2, 3, 4, 5] の合計を計算しているため、0 + 1 + 2 + 3 + 4 + 5 = 15 が出力されます。

注意点

この実装は学習目的のシンプルなものです。実際の Array.prototype.reduce() では、空の配列に対して初期値なしで呼び出すと TypeError がスローされるなど、より厳密な仕様が定められています。本番のコードでは標準の reduce() を使うことを推奨します。