배열 중복 제거

코딩테스트 문제를 풀다보면 배열의 중복을 제거하는 경우가 있어 정리를 하고 싶었습니다.

1. Set

JavaScript에서 Set은 고유한 값의 모음입니다. 각 값은 Set에서 한 번만 발생할 수 있습니다. Set은 모든 데이터 유형의 값을 보유할 수 있습니다.

const arr = [1, 2, 3, 1, 2, 3, 4, 5];
const set = new Set(arr);
const newArr = [...set]; 
console.log(newArr); // [ 1, 2, 3, 4, 5 ]

or

const arr = [1, 2, 3, 1, 2, 3, 4, 5];
const newArr = Array.from(new Set(arr));
console.log(newArr); // [ 1, 2, 3, 4, 5 ]

2. filter(), indexOf()

filter() 메서드는 callback 함수에서 true 값을 반환합니다.
indexOf() 메서드는 배열에서 지정된 요소를 찾을 수 있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다.

arr 배열에서 arr[3]에 있는 1 값이 나오더라도 arr.indexOf(el) 의 값은 0이 나오기 때문에 false가 나옵니다.

const arr = [1, 2, 3, 1, 2, 3, 4, 5];
const newArr = arr.filter((el, i) => arr.indexOf(el) === i);
console.log(newArr); // [ 1, 2, 3, 4, 5 ]

3. reduce(), includes()

reduce() 메서드는 배열 요소에 대한 reducer 함수를 실행하고 하나의 결과 값을 반환합니다.
includes() 메서드는 배열에 항목 중 특정 값이 포함되어 있는지 여부를 확인하여 true 또는 false를 반환합니다.

reduce() 메서드의 callback 함수에서 acc.includes(cur) (현재 값이 acc배열 안에 포함되어 있는 문법)가 true라면 acc를 반환하고 false라면 새로운 배열안에 스프레드 연산자를 사용하여 acc에 스프레드 연산자를 사용한 후 cur을 추가해줍니다.

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

let initialValue = []
const newArr = arr.reduce((acc, cur) => acc.includes(cur) ? acc : [...acc, cur], initialValue);
console.log(newArr); // [ 1, 2, 3, 4, 5 ]

4. forEach(), includes()

반복문을 사용하여 중복을 제거 할 수도 있습니다.

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

let newArr = []
arr.forEach((el) => {
  if (!newArr.includes(el)) {
    newArr.push(el);
  }
})

reference
https://jsikim1.tistory.com/227
https://codechacha.com/ko/javascript-remove-duplicates-in-array/
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Set
https://www.w3schools.com/js/js_object_sets.asp
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
https://www.w3schools.com/jsref/jsref_indexof_array.asp
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
https://www.w3schools.com/jsref/jsref_reduce.asp
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes