JavaScript 사용자 정의 함수로 배열에서 중복 항목 모두 제거하는 방법

문제 소개

리터럴 값들로 구성된 배열을 인수로 받는 JavaScript 함수를 작성해야 합니다. 만약 어떤 요소가 배열 안에 두 번 이상 나타난다면, 이 함수는 해당 요소의 모든 인스턴스를 배열에서 완전히 제거해야 합니다.

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

const arr = [1,2,3,4,4,5,5];

여기서 4와 5는 각각 두 번씩 등장하므로, 기대되는 출력 결과는 다음과 같습니다.

const output = [1, 2, 3];

구현 예제

const arr = [1, 2, 3, 4, 4, 5, 5];
const removeAll = (arr = [], val) => {
   while(arr.includes(val)){
      const index = arr.indexOf(val);
      arr.splice(index, 1);
   };
};
const eradicateDuplicates = (arr = []) => {
   for(let i = 0; i < arr.length; ){
      const el = arr[i];
      if(arr.indexOf(el) === arr.lastIndexOf(el)){
         i++;
         continue;
      };
      removeAll(arr, el);
   };
};
eradicateDuplicates(arr);
console.log(arr);

코드 동작 원리

위 코드는 두 개의 화살표 함수로 구성되어 있습니다.

removeAll(arr, val) : 지정한 값(val)이 배열에 존재하는 동안 while 루프를 반복하며, indexOf()로 해당 값의 위치를 찾아 splice()로 하나씩 제거합니다. 이 과정을 통해 특정 값의 모든 인스턴스가 배열에서 사라집니다.

eradicateDuplicates(arr) : 배열을 순회하면서 각 요소에 대해 indexOf()와 lastIndexOf()의 반환값을 비교합니다. 두 값이 같다는 것은 해당 요소가 배열에 단 한 번만 등장한다는 의미이므로, 인덱스를 증가시켜 다음 요소로 넘어갑니다. 반대로 두 값이 다르면 중복된 요소이므로 removeAll()을 호출하여 관련 값을 모두 제거합니다. 이때 요소가 제거되면 배열의 길이가 줄어들고 현재 인덱스 자리에 새로운 요소가 들어오기 때문에, 인덱스를 증가시키지 않은 채 그 자리에서 계속 검사를 진행합니다.

출력 결과

코드를 실행하면 콘솔에 다음과 같은 결과가 출력됩니다.

[1, 2, 3]