배열 안에 중복되는 요소 제거

let numbers = [1, 2, 3, 4, 2, 6, 6, 5];

numbers이라는 배열 안에는 중복되는 숫자가 있다. 중복되는 숫자(2, 6)를 제거하는 방법은 무엇이 있을까?

 

1. indexOf()

function getUniqueNumbers(numbers){
    return numbers.filter((num, index) => index === numbers.indexOf(num));
}

console.log(getUniqueNumbers([1, 2, 3, 4, 2, 6, 6, 5])); // [1, 2, 3, 4, 6, 5]

 

indexOf() 메서드는 배열에서 지정된 요소가 존재한다면 해당 요소의 인덱스를 반환하고, 존재하지 않으면 -1을 반환한다. 이때 찾고자 하는 요소가 배열 안에 여러개가 존재한다면 가장 앞에 있는 요소의 인덱스를 반환한다.

let arr = [1, 2, 3, 4, 2];
console.log(arr.indexOf(2)); // 1

 

 getUniqueNumbers  함수의 매개변수로 들어오는 배열(numbers)에 filter() 메서드를 사용하여, filter() 메서드의 콜백함수에 전달받은 인덱스의 값(index)이 현재 엘리먼트(num)가 indexOf()의 반환 값과 같은 숫자들만 다시 새로운 배열로 만들어 반환하도록 하면 중복된 숫자가 제거된 배열을 얻을 수 있다.

 

num	index	indexOf	result
1	0	0	true
2	1	1	true
3	2	2	true
4	3	3	true
2	4	1	false
6	5	5	true
6	6	5	false
5	7	7	true

 

2. caching / frequency map

function getUniqueNumbers(numbers){
    const uniqueNumbers = {};
    const result = [];

    for(let num of numbers){
        if(!uniqueNumbers[num]){
            result.push(num);
        }
        uniqueNumbers[num] = num;
    }
    return result;
}

console.log(getUniqueNumbers([1, 2, 3, 4, 2, 6, 6, 5])); // [1, 2, 3, 4, 6, 5]

 getUniqueNumbers  함수의 매개변수로 들어오는 배열을 for...of 명령문을 사용하여 각각의 요소를 uniqueNumbers 객체의 key와 valuse 값으로 넣어준다. 이때 해당 요소가 uniqueNumbers 객체에 존재하지 않는다면 result 배열에 넣어준다.(배열(numbers)의 숫자 중에 처음으로 만난 숫자이기 때문)

 

for...of 명령문이 끝나게 되면 result 안에는 중복되지 않은 숫자만 들어있게 된다.

 

3. Set()

Set 객체는 자료형에 관계 없이 원시 값과 객체 참조 모두 중복없이 유일한 값을 저장할 수 있다. 

let test = new Set();
let obj = {a:1, b:2}

test.add(1)
test.add(2)
test.add(3)
test.add(1)
test.add(obj)


console.log(test); // Set {1, 2, 3, {a:1, b:2}}
console.log(test.has(1)); // true
console.log(test.has(obj)); // true
console.log(test.has(4)); // false
console.log(test.size); // 4

 

function getUniqueNumbers(numbers){
    return [...new Set(numbers)];
}

console.log(getUniqueNumbers([1, 2, 3, 4, 2, 6, 6, 5])); // [1, 2, 3, 4, 6, 5]

생성자를 사용하여 Set 객체를 만든 후, 함수의 매개변수로 들어오는 배열을 넣어주게 되면 배열 안에 중복요소를 필터링 한 상태로 초기화 한다. 그런 다음에 스프레드 연산자를 사용하여 배열로 변환한 후 반환하게 되면 중복된 숫자가 제거 된 배열을 얻을 수 있다.