[javascript] 중복 제거 - to remove duplicataes in an Array

배열에서 중복 제거를 할 때 사용하는 방법을 몇가지 정리해보자

 

1. filter 와 indexOf 사용.

var arr = ['A', 'B', 'C', 'D', 'C', 'A'];

arr.filter(function(ele, idx){
	console.log(ele, arr.indexOf(ele), idx);
});

우선 위와 같이 filter 를 걸어 각 요소의 값들이 어떻게 나오는지 확인을 해보자

A 0 0
B 1 1
C 2 2
D 3 3
C 2 4
A 0 5

위와 같이 값이 나올 것이다.

이제 여기에서 indexOf 값과 index 값이 같은 경우만 남기면 중복 제거가 된다.

var arr = ['A', 'B', 'C', 'D', 'C', 'A'];

var removeDup = arr.filter(function(ele, idx){
	return arr.indexOf(ele) === idx;
});

console.log(removeDup);

 

2. includes 와 forEach 사용.

var arr = ['A', 'B', 'C', 'D', 'C', 'A'];

var removeDup = [];
arr.foeEach(function(ele){
	if(!removeDup.includes(ele)){
    	removeDup.push(ele);
    }
});

console.log(removeDup);

위와 같이 작성하면 간단히 중복제거를 할 수 있다.

물론 includes 대신 indexOf 라던지 find 라던지 적절한 function 과 로직으로 변경해서 진행도 가능하다.

 

3. sort 와 reduce 사용

var arr = ['A', 'B', 'C', 'D', 'C', 'A'];

var result = arr.sort().reduce(functioin(acc, cur){
	const length = acc.length;
    if(length ===0 || acc[length - 1] !== cur){
    	acc.push(cur);
    }
    return acc;
}, []);

console.log(result);

강력한 reduce 를 사용해서도 중복 제거가 가능하다.

 

4. 기타 방법 - Set

var arr = ['A', 'B', 'C', 'D', 'C', 'A'];

var removeDup = [...new Set(arr)];

console.log(removeDup);

Set 객체는 자료형에 관계 없이 원시 값과 객체 참조 모두 유일한 값을 저장할 수 있습니다. 그래서 중복 제거가 가능하다. 단순히 중복 제거 외에도 넣고, 빼고, 차이비교 등 다양한 메서드를 제공한다.

 

참조 사이트

https://dev.to/soyleninjs/3-ways-to-remove-duplicates-in-an-array-in-javascript-259o