JavaScriptで連続する要素と直前の要素の平均値を求める方法

連続する要素の平均を計算するとは

ここでは、次のような数値の配列を例に考えてみましょう。

const arr = [3, 5, 7, 8, 3, 5, 7, 4, 2, 8, 4, 2, 1];

この配列に対して、「各要素と、その直前の要素（隣接する先行要素）の平均値」を格納した新しい配列を返す関数を作成します。

ただし、最初の要素には直前の要素が存在しないため、その場合は例外として元の要素をそのまま返すものとします。

実装コード：Array.prototype.map() を活用

このような処理には、Array.prototype.map() メソッドを使うのが便利です。mapは各要素に対してコールバック関数を実行し、その戻り値から新しい配列を生成してくれるためです。

以下が実際のコード例です。

サンプルコード

const consecutiveAverage = arr => {
    return arr.map((el, ind, array) => {
        return ((el + (array[ind-1] || 0)) / (1 + !!ind));
    });
};
console.log(consecutiveAverage(arr));

コードの仕組みを解説

この関数のポイントは、次の2つのテクニックにあります。

1. (array[ind-1] || 0)
インデックス 0 の要素には直前の要素が存在しないため、array[-1] は undefined になります。そこで論理和（||）を使い、undefined の場合には 0 を代わりに使用することで、エラーを回避しつつ合計を計算できます。

2. (1 + !!ind)
除算する数を動的に決定しています。インデックスが 0 の場合、!!ind は false（数値変換で 0）となるため「1」で割られ、元の値がそのまま返されます。インデックスが 1 以降の場合は true（1）となるため「2」で割られ、直前の要素との平均値が計算されます。

実行結果

コンソールへの出力は次のようになります。

[
    3, 4, 6, 7.5, 5.5, 4,
    6, 5.5, 3, 5, 6, 3,
    1.5
]

たとえば2番目の要素 5 については、直前の要素 3 との平均である (3 + 5) / 2 = 4 が出力されていることが確認できます。このように、mapのコールバック内で現在のインデックスと配列本体を利用すれば、隣接要素を参照した柔軟な変換処理を簡潔に記述できます。