JavaScript: 보자보자 Set이 뭔가 보자

이예빈·2022년 9월 2일

JavaScript

목록 보기

18/26

백준 알고리즘 문제를 풀다가 중복 제거 관련한 문제가 있었는데
반복문이나 순환 말고 쓸 수 있는 게 없을까 찾아보다가 Set이라는 것을 발견하게 되었다.

Set 🎁

Set은 JavaScript의 표준 내장 객체로서 Set을 사용하면 데이터가 원시자료형이든 참조자료형이든 관계 없이 모든 유형의 고유한 값을 저장할 수 있다.
즉 Set은 값의 콜렉션이며, 콜렉션 내부에서 동일한 값은 한 번만 존재해야(유일해야) 한다.

1. Set 생성자

Set 객체는 Set 생성자 함수로 생성할 수 있다.

const mySet = new Set(); // Set {} ➡️ 빈 Set 객체 생성

Set 객체는 중복된 값을 요소로 저장하지 않으므로 중복된 요소를 제거할 때 사용할 수 있다.

const mySet1 = new Set('hello'); // Set {'h', 'e', 'l', 'o'}
const arr1 = [1,2,3,4,1,2,3,4,5];
const mySet2 = new Set(arr1) // Set {1,2,3,4,5}
const arr2 = [...mySet2] // [1,2,3,4,5]

2. Set 객체에 요소 추가, 삭제, 조회하기

생성된 Set 객체에는 add(), delete() 메서드를 이용하여 간단하게 값을 추가하고 삭제할 수 있다. has() 메서드를 이용하면 해당 Set 객체에 특정 값의 요소가 존재하는지 조회할 수 있다.

mySet.add(1); // Set {1}
mySet.add(3); // Set {1, 3} ➡️ 추가한 순서대로 추가된다.
mySet.add(1); // Set {1, 3} ➡️ 1이 이미 있으므로 추가되지 않음
mySet.delete(1); // Set {3}
mySet.has(1) // false ➡️ 1을 삭제 했으므로 조회되지 않음

Set 객체에는 값이 추가된 순서대로 element가 저장되지만 순서에 의미가 있지는 않다. 따라서 인덱스로 특정 요소에 접근할 수 없다.

3. Value equality

엄격한 일치 비교 연산자를 사용하면 NaN !== NaN이지만
Set에서는 동일한 값으로 취급하여 중복으로 추가할 수 없다.
그리고 다른 주소값을 가진 참조자료형은 형태가 같더라도 다른 값으로 취급한다.😥

console.log(NaN === NaN) // false
const mySet1 = new Set().add(NaN).add(NaN) // Set {NaN}

const obj = {a: 1, b: 2};
const mySet2 = new Set().add(obj).add({a: 1, b: 2});
// Set {{a: 1, b: 2}, {a: 1, b: 2}}