Set 객체

ECMA Script 2015(ES6)에 추가된 Set 객체는 자료형에 관계없이 원시값과 객체 참조 모두 유일한 값을 저장하는 자료구조이다.

수학에서 다루는 집합과 동일한 개념이라고 볼 수 있다.

 

Set 객체는 new 연산자와 함께 Set 생성자함수를 호출하여 생성할 수 있다.

const set = new Set();

console.log(set); // Set(0) {}

생성자함수를 호출할 때 인수로 이터러블을 전달하면 해당 이터러블의 중복된 요소를 제거한 Set 객체가 생성된다.

const set = new Set([3, 4, 4, 5]);

console.log(set); // Set(3) { 3, 4, 5 }

Set.prototype.add 메서드를 이용하여 Set 객체에 요소를 추가할 수 있다. 이때 중복되는 요소는 추가되지 않고, Set 객체가 현재 요소로 가지지 않는 값만 추가된다.

const set = new Set([2, 3, 4]);

set.add(1);

console.log(set); // Set(4) { 2, 3, 4, 1 }

set.add(2);

console.log(set); // Set(4) { 2, 3, 4, 1 }

 

Set 객체는 배열이나 객체와 같은 객체 타입을 요소로 가질 수도 있다.

const set = new Set();

set.add([1, 2]);

console.log(set); // Set(1) { [ 1, 2 ] }

이때 주의해야 할 점은 원시값이 아닐 경우 Set 객체는 유일한 객체 참조 값을 저장한다는 점이다.

즉, 참조값이 다른 두 객체는 서로 다른 객체로 보고 Set에 저장된다.

const set = new Set();

set.add([1, 2]);

console.log(set); // Set(1) { [ 1, 2 ] }

set.add([1, 2]);

console.log(set); // Set(2) { [ 1, 2 ], [ 1, 2 ] }

이와 같이 Set 객체에 추가한 두 배열 [1, 2]와 [1, 2]는 서로 다른 참조값을 가지므로 서로 다른 두 요소로서 Set 객체에 저장된 것을 알 수 있다.

 

그렇다면 요소를 삭제할 경우는 어떨까?

먼저 Set 객체의 원시값을 삭제하는 경우를 살펴보자.

다음과 같이 Set.prototype.delete 메서드를 이용하면 Set 객체의 특정 요소를 삭제할 수 있다.

const set = new Set([1, 2, 3]);

console.log(set); // Set(3) { 1, 2, 3 }

set.delete(2);

console.log(set); // Set(2) { 1, 3 }

하지만 요소가 객체 타입인 경우에는 삭제하려는 객체의 참조값을 전달하지 않으면 객체를 삭제할 수 없다.

const set = new Set([
  [1, 2],
  [1, 2]
]);

console.log(set); // Set(2) { [ 1, 2 ], [ 1, 2 ] }

set.delete([1, 2]);

console.log(set); // Set(2) { [ 1, 2 ], [ 1, 2 ] }

 

지금까지 Set 객체의 요소가 각각 원시값과 객체 타입일 때 Set 객체에 요소를 추가하고 삭제하는 방법과 차이점을 살펴보았다.

Set 객체가 객체 타입의 요소를 가질 경우에는 객체의 유일한 참조값을 저장한다는 것을 기억하고 잘못 사용하는 일이 없도록 하자.