JavaScript에서 같은 글자로 시작하는 중복 문자열 제거하기

문자열 배열을 입력받아, 첫 글자가 서로 같은 문자열이 여러 개 있을 경우 각 글자마다 하나의 문자열만 남기고 나머지는 모두 삭제하는 JavaScript 함수를 작성해야 합니다.

예를 들어 다음과 같은 배열이 있다고 가정해 보겠습니다.

const arr = ['Apple', 'Jack', 'Army', 'Car', 'Jason'];

여기서 'Apple'과 'Army'는 모두 A로 시작하고, 'Jack'과 'Jason'은 모두 J로 시작합니다. 따라서 각 쌍에서 하나씩 골라 삭제하여, 배열에는 시작 글자가 서로 다른 문자열만 남도록 만들어야 합니다.

구현 예제

이 문제를 해결하는 코드는 다음과 같습니다.

const arr = ['Apple', 'Jack', 'Army', 'Car', 'Jason'];
const deleteSameLetterWord = arr => {
   const map = new Map();
   arr.forEach((el, ind) => {
      if(map.has(el[0])){
         arr.splice(ind, 1);
      }else{
         map.set(el[0], true);
      }
   });
};
deleteSameLetterWord(arr);
console.log(arr);

출력 결과

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

[ 'Apple', 'Jack', 'Car' ]

코드 동작 원리

핵심 아이디어는 Map 객체를 활용해 이미 등장한 첫 글자를 추적하는 것입니다. forEach로 배열을 순회하면서 각 문자열의 첫 글자(el[0])가 Map에 이미 존재하는지 확인하고, 존재하면 splice()로 해당 요소를 배열에서 제거하고, 존재하지 않으면 Map에 그 글자를 기록합니다.

다만 이 방식에는 주의할 점이 있습니다. splice()로 요소를 제거하면 배열의 인덱스가 즉시 재배열되기 때문에, 같은 글자로 시작하는 문자열이 연속해서 등장하면 일부 요소가 순회에서 건너뛰어질 수 있습니다. 예를 들어 ['Apple', 'Army', 'Avocado']처럼 세 요소가 모두 A로 시작하면 'Avocado'가 삭제되지 않고 그대로 남게 됩니다.

이런 문제를 피하려면 filter() 메서드를 사용하는 것이 더 안전합니다.

const arr = ['Apple', 'Jack', 'Army', 'Car', 'Jason'];
const seen = new Set();
const result = arr.filter(el => {
   if(seen.has(el[0])){
      return false;
   }
   seen.add(el[0]);
   return true;
});
console.log(result);

filter()는 원본 배열을 수정하지 않고 새 배열을 반환하므로, 인덱스가 어긋나는 문제 없이 항상 정확한 결과를 얻을 수 있습니다.