ループ処理でJavaScript配列の全要素の出現頻度を取得する方法

数値や文字列を含む配列が与えられ、その中に重複した要素が含まれている場合、各要素が配列内に出現する回数（頻度）を求めたいことがよくあります。このようなケースでは、「要素をキー」「出現回数を値」とするオブジェクトを返すのが最も適した形式です。

実装の流れはシンプルです。まず forEach() ループを使って配列を反復処理し、結果を格納するオブジェクト内に該当する要素のカウントがすでに存在すれば値を1つ増やし、まだ存在しなければ新しいプロパティを作成して1をセットします。

そして最後に、集計結果が入ったオブジェクトを返せば完成です。

この問題に対する完全なコードは以下の通りです。

サンプルコード

const arr = [2,5,7,8,5,3,5,7,8,5,3,4,2,4,2,1,6,8,6];
const getFrequency = (array) => {
    const map = {};
    array.forEach(item => {
        if(map[item]){
            map[item]++;
        }else{
            map[item] = 1;
        }
    });
    return map;
};
console.log(getFrequency(arr));

コードの解説

1. 空のオブジェクトを用意： 集計結果を格納するための空オブジェクト map を作成します。
2. forEach()で反復処理： 配列の各要素に順番にアクセスしていきます。
3. 既存ならカウントアップ： map[item] が真と評価される（すでに登録済み）場合は、カウントを1増やします。
4. 未登録なら新規作成： 初めて登場した要素の場合は、新しいプロパティとして1を設定します。
5. 結果を返す： 全要素の処理が完了したら、オブジェクトを返します。

出力結果

コンソールには次のような出力が表示されます。

{ '1': 1, '2': 3, '3': 2, '4': 2, '5': 4, '6': 2, '7': 2, '8': 3 }

なお、オブジェクトのキーは自動的に文字列化されるため、数値の要素も文字列のキーとして保存されている点には注意が必要です。

補足：reduce() を使った代替方法

同じ処理は reduce() メソッドを使うことで、より簡潔に記述することもできます。

const getFrequency = (array) => {
    return array.reduce((acc, item) => {
        acc[item] = (acc[item] || 0) + 1;
        return acc;
    }, {});
};
console.log(getFrequency(arr));

どちらの方法も計算量は O(n) で、配列を一度だけ走査すればよいため非常に効率的です。可読性やチームのコーディングスタイルに合わせて、最適な方法を選択するとよいでしょう。