배열 중복 제거하는 3가지 방법 (배열의 합집합)

1. Set

2. indexOf(), filter()

3. forEach(), includes()

1. Set

Javascript에서 Set 객체를 이용하면 중복없는 데이터를 표현할 수 있다.

Set 객체의 이런 특징을 이용해서, 배열의 중복을 제거할 수 있다.

const numberArray = [1, 2, 3, 1, 2];

const set = new Set(numberArray);

const uniqueArray = [...set];

console.log(uniqueArray);
// 1, 2, 3

• const set = new Set(numberArray);
  중복값이 있는 배열을 Set 객체로 만들어서 중복을 제거

• const uniqueArray = [...set];
  Spread Operator(전개연산자)를 사용하여 Set 객체를 배열로 변환

2. indexOf(), filter()

indexOf() : 배열에서 특정값이 처음으로 나타나는 index를 리턴

string.indexOf(searchvalue, position)
indexOf 함수는, 문자열(string)에서 특정 문자열(searchvalue)을 찾고,
검색된 문자열이 '첫번째'로 나타나는 위치 index를 리턴한다.

• 파라미터
  searchvalue : 필수 입력값, 찾을 문자열
  position : optional, 기본값은 0, string에서 searchvalue를 찾기 시작할 위치

찾는 문자열이 없으면 -1을 리턴한다.
문자열을 찾을 때 대소문자를 구분한다.

---

filter() : 특정 조건에 부합하는 배열의 모든 값을 배열 형태로 리턴

const numberArray = [1, 2, 3, 1, 2];

const uniqueArray = numberArray.filter((element, index) => {
    return numberArray.indexOf(element) === index;
});

console.log(uniqueArray);
// 1, 2, 3

• dupArr.filter(callback);
  filter()는 dupArr의 원소들을 callback 함수로 전달하여
  각 원소들이 callback 함수에 정의된 기준에 부합하는지 검사하고,
  검사 결과가 true를 리턴하는 원소을 모아서 배열 형태로 리턴(uniqueArr) 한다.

• dupArr.indexOf(element) === index;

filter()로 전달 된 callback 함수는
검사하고 있는 값(element)이 배열(dupArr)에서 가장 처음으로 나타는 index와
검사하고 있는 원소의 index와 비교하여 같을 경우에만 true를 리턴한다.

결과적으로, 배열의 요소에 대해 true를 반환하게 되지만 이미 true인 중복된 요소는 false를 반환하게 된다.
반환된 그 요소들중 true만 filter로 걸러지기 때문에 중복을 제거할 수 있게 된다.

3. forEach(), includes()

forEach() : 주어진 배열을 순회하면서, 배열의 원소들로 주어진 callback함수를 실행

include() : 주어진 배열에 특정 값이 포함되는지 여부를 검사

const numberArray = [1, 2, 3, 1, 2];

let uniqueArray = [];
numberArray.forEach((element) => {
    if (!uniqueArray.includes(element)) {
        uniqueArray.push(element);
    }
});

console.log(uniqueArray);
// 1, 2, 3

• dupArr.forEach(callback);
  numberArray(중복이 있는 배열)을 순회

• if (!uniqueArr.includes(element))
  uniqueArray(중복이 없는 배열)이 배열의 원소를 가지고 있지 않다면,

• uniqueArr.push(element)
  uniqueArray에 배열의 원소를 집어넣는다.