JavaScript 배열에서 가장 많이 등장하는 요소의 인덱스 구하기

문자열 또는 숫자 리터럴로 이루어진 배열을 입력받아, 가장 많이 등장한 요소의 인덱스를 반환하는 함수를 작성해야 한다고 가정해 보겠습니다.

이 문제를 해결하는 가장 효율적인 방법은 배열을 한 번 순회하면서 각 요소의 등장 횟수를 기록하는 빈도 맵(frequencyMap)을 만드는 것입니다. 그런 다음 빈도 맵에서 최대 등장 횟수를 가진 값을 찾아, 해당 값이 원본 배열에서 처음 등장하는 위치의 인덱스를 반환하면 됩니다.

구현 코드

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));

코드 동작 방식

이 코드의 로직은 다음과 같이 단계별로 진행됩니다.

1. 빈도 맵 생성: forEach로 배열을 순회하며 각 요소가 이미 맵에 존재하면 카운트를 1 증가시키고, 없으면 1로 초기화합니다.
2. 최다 등장 요소 탐색: Object.keys()로 맵의 모든 키를 확인하면서 등장 횟수가 가장 높은 값을 찾습니다. 객체의 키는 문자열이므로 parseInt(key, 10)를 사용해 다시 숫자로 변환해야 합니다.
3. 인덱스 반환: 최종적으로 arr.indexOf(highest)를 통해 해당 요소가 배열에서 처음 나타나는 인덱스를 반환합니다.

출력 결과

콘솔에 출력되는 결과는 다음과 같습니다.

6
1

첫 번째 배열(arr1)에서는 숫자 34가 세 번 등장하여 가장 많으므로, 34가 처음 나타나는 인덱스인 6이 출력됩니다. 두 번째 배열(arr2)에서는 여러 숫자가 두 번씩 등장하지만, 먼저 발견된 12가 선택되어 인덱스 1이 아닌 첫 등장 위치가 반환됩니다. 참고로 12는 인덱스 0과 5에 위치하지만, 예제 결과에서는 조건 비교 시 먼저 처리된 키 순서에 따라 결과가 달라질 수 있습니다.