🥫 concat

indexOf(), filter()

indexOf() 함수는, 배열에서 특정값이 처음으로 나타나는 index를 리턴합니다.

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

const dupArr = [1, 2, 3, 1, 2];
const uniqueArr = dupArr.filter((element, index) => {
return dupArr.indexOf(element) === index;
});
document.writeln(Array.isArray(uniqueArr));
document.writeln(uniqueArr);

위 예제에서

dupArr.filter(callback);

filter() 함수는

dupArr의 원소들을 callback 함수로 전달하여

각 원소들이 callback 함수에 정의된 기준에 부합하는지 검사하고,

검사 결과가 true를 리턴하는 원소을 모아서 배열 형태로 리턴(uniqueArr) 합니다.

dupArr.indexOf(element) === index;

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

위의 예제에서 dupArr의 값이 순서대로 전달되면
'dupArr.indexOf(element) === index' 구문은
true, true, true, false, false 를 순서대로 리턴하여
중복되는 값이 첫번째로 나타나는 경우에만 filter 함수에서 걸러지도록 하였습니다.

Set 객체를 활용하여 배열의 중복 원소 제거하는 법

Set은 ES6에서 등장한 새로운 데이터 object이다. Set은 unique한 값만 저장할 수 있도록 하기 때문에 Array에 넣게 되면 중복되는 값이 사라진다.

const dupArr = [1, 2, 3, 1, 2];
const set = new Set(dupArr);
const uniqueArr = [...set];
console.log(uniqueArr) // [1, 2, 3]

중복값이 있는 배열을 Set객체로 만들면 중복이 제거가 되는데, 이를 다시 Spread Oprator를 활용하여 배열로 변환하면 처음 배열에서 중복값이 제거된 상태가 된다. Spread Operator 말고 Array.from으로 배열로 변경해도 같은 결과가 나온다.

const dupArr = [1, 2, 3, 1, 2];
const set = new Set(dupArr);
const uniqueArr = Array.from(set);
console.log(uniqueArr) // [1, 2, 3]