【JavaScript】配列内で最も頻繁に出現する要素のインデックスを取得する方法

文字列や数値のリテラルを含む配列を受け取り、その中で最も多く出現する要素のインデックスを返す関数を作成することを考えてみましょう。

基本的なアプローチは次のとおりです。

1. 配列を走査しながら、各要素の出現回数を記録した「頻度マップ(frequencyMap)」を作成する
2. 頻度マップの中から、出現回数が最大となる要素を特定する
3. その要素が元の配列のどこにあるかを indexOf() で調べて返す

実装例

const arr1 = [12, 5, 6, 76, 23, 12, 34, 5, 23, 34, 65, 34, 22, 67, 34];
const arr2 = [12, 5, 6, 76, 23, 12, 34, 5, 23, 34];
const mostAppearances = (arr) => {
    const frequencyMap = {};
    arr.forEach(el => {
       if(frequencyMap[el]){
           frequencyMap[el]++;
       }else{
           frequencyMap[el] = 1;
       };
    });
    let highest, frequency = 0;
    Object.keys(frequencyMap).forEach(key => {
       if(frequencyMap[key] > frequency){
           highest = parseInt(key, 10);
           frequency = frequencyMap[key];
       };
    });
    return arr.indexOf(highest);
};
console.log(mostAppearances(arr1));
console.log(mostAppearances(arr2));

出力

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

6
1

コードの解説

この関数は以下の3つのステップで動作します。

ステップ1:頻度マップの作成
forEach() を使って配列を走査し、各要素を出現回数とともにオブジェクト frequencyMap に記録していきます。すでにキーが存在すればカウントを +1 し、存在しなければ 1 で初期化します。

ステップ2:最多出現要素の特定
Object.keys() で頻度マップのすべてのキーを取得し、出現回数が最大の要素を特定します。ここでは parseInt() を使って、文字列化されたキーを数値へ戻しています。

ステップ3:インデックスの返却
最も多く出現した要素に対して arr.indexOf(highest) を呼び出し、元の配列におけるその位置(インデックス)を返します。

実行結果について

arr1 の場合、34 が4回出現しており最も多いため、そのインデックスである 6 が返されます。

arr2 の場合、12・5・23・34 がそれぞれ2回ずつ出現して同率ですが、この実装では先に条件を満たした要素が採用されるため、インデックス 1 が返されます。

なお、この実装は数値の配列を前提としています。文字列の配列を扱いたい場合は、parseInt() による変換を行わず、キーをそのまま使用するように修正してください。