[JavaScript] 중복되는 배열 요소를 제거하고 유니크한 값들만 구하기

배열 요소 중 중복되는 요소를 제거하고 유니크한 값들만을 갖는 배열을 구하는 방법은 너무나 다양하다.

StackOverflow 에서 공유되고 있는 몇 가지 방법들이 있어서 간단하게 정리해보았다.

jQuery를 사용한 빠르고 지저분한(?) 방법

http://api.jquery.com/jquery.unique/

큰 퍼포먼스 저하가 없다면, 직접 로직을 짜는 것보다는 jQuery 내장 로직을 이용하는게 가장 나을지도 모른다.

var names = ["Mike","Matt","Nancy","Adam","Jenny","Nancy","Carl"];
var uniqueNames = [];

$.each(names, function(i, el){
	if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);
});

기존 순서는 그대로 두고, 중복된 것만 제거하는 방법

indexOf 로 중복 여부를 체크해서 새로운 값들만 추가하는 방식이다. indexOf, push 모두 약간은 비용이 들 것같은 메서드이지만, 그래도 꽤 깔끔하게 로직이 짜여진다.

var names = ["Mike","Matt","Nancy","Adam","Jenny","Nancy","Carl"];

var uniq = names.reduce(function(a,b){
	if (a.indexOf(b) < 0 ) a.push(b);
	return a;
  },[]);

console.log(uniq, names) // [ 'Mike', 'Matt', 'Nancy', 'Adam', 'Jenny', 'Carl' ]

// 한 줄로 표현
return names.reduce(function(a,b){if(a.indexOf(b)<0)a.push(b);return a;},[]);

순서 재정렬과 함께 중복된 요소를 제거하는 방법

먼저 slice로 복사본을 만든뒤, 정렬하고, 바로 앞의 값과 비교해서 추가해나가는 방식이다.

var uniq = names.slice() // 정렬하기 전에 복사본을 만든다.
.sort(function(a,b){
	return a - b;
})
.reduce(function(a,b){
	if (a.slice(-1)[0] !== b) a.push(b); // slice(-1)[0] 을 통해 마지막 아이템을 가져온다.
	return a;
},[]); //a가 시작될 때를 위한 비어있는 배열

// 한 줄로 표현
return names.slice().sort(function(a,b){return a - b}).reduce(function(a,b){if (a.slice(-1)[0] !== b) a.push(b);return a;},[]);

참고

http://stackoverflow.com/a/15868720