JavaScriptで配列データを科目ごとにグループ化して集計する方法

JavaScriptでは、配列の中にさらに配列が格納されたデータ（ネストされた配列）を扱う場面がよくあります。例えば、生徒たちの科目別の点数を次のような形式で保持しているケースを考えてみましょう。

const arr = [
    ["English", 52],
    ["Hindi", 154],
    ["Hindi", 241],
    ["Spanish", 10],
    ["French", 65],
    ["German", 98],
    ["Russian", 10]
];

やりたいこと

このような配列を受け取り、科目名をキーとした「オブジェクトのオブジェクト」を返す関数を作成します。各科目のオブジェクトには、次の情報を持たせます。

• count：その科目が出現した回数
• total：その科目の合計点
• average：その科目の平均点

実装コード

この処理には、配列を単一の値へ畳み込む reduce() メソッドを使うのが効果的です。以下がそのコードです。

const groupSubjects = arr => {
    const grouped = arr.reduce((acc, val) => {
        const [key, score] = val;
        // 初めて登場した科目の場合は初期化
        if (!Object.prototype.hasOwnProperty.call(acc, key)) {
            acc[key] = {
                'count': 0,
                'total': 0
            };
        }
        const subject = acc[key];
        subject['count']++;
        subject['total'] += score;
        // 累計の合計点を出現回数で割り、平均を求める
        subject['average'] = subject['total'] / subject['count'];
        return acc;
    }, {});
    return grouped;
};
console.log(groupSubjects(arr));

実行結果

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

{
English: { count: 1, total: 52, average: 52 },
Hindi: { count: 2, total: 395, average: 197.5 },
Spanish: { count: 1, total: 10, average: 10 },
French: { count: 1, total: 65, average: 65 },
German: { count: 1, total: 98, average: 98 },
Russian: { count: 1, total: 10, average: 10 }
}

コードのポイント

• reduce() の活用：初期値として空のオブジェクト {} を渡し、各要素を処理しながら結果を蓄積していきます。
• プロパティの存在チェック：科目キーがまだ存在しない場合のみ、count と total を 0 で初期化します。ES2022以降の環境では、より安全な Object.hasOwn() を使うこともできます。
• 平均点の計算に注意：平均は「累計の合計点 ÷ 出現回数」で求める必要があります。直前に処理した点数だけで割ってしまうと誤った値になるため、必ず累計値 subject['total'] を使うようにしましょう。

代替手段：Object.groupBy()

比較的新しいJavaScript環境（ES2024以降）では、Object.groupBy() を使うことでグループ化自体を簡潔に記述できます。ただし、出現回数・合計・平均といった複数の集計を同時に行いたい場合は、今回のように reduce() を使う方法の方が柔軟で確実です。