[JS] 📚 자바스크립트 자료형 Set 🚩 정리

 

셋(Set)

셋(Set)은 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션입니다.

셋에 키가 없는 값이 저장됩니다.

let sett = new Set(["bananas", "oranges", "bananas", "apples", "bananas"]); 
// Set(3) {'bananas', 'oranges', 'apples'}

new Set(iterable) – 셋을 만듭니다. 이터러블 객체를 전달받으면(대개 배열을 전달받음) 그 안의 값을 복사해 셋에 넣어줍니다.

set.add(value) – 값을 추가하고 셋 자신을 반환합니다.

set.delete(value) – 값을 제거합니다. 호출 시점에 셋 내에 값이 있어서 제거에 성공하면 true, 아니면 false를 반환합니다.

set.has(value) – 셋 내에 값이 존재하면 true, 아니면 false를 반환합니다.

set.clear() – 셋을 비웁니다.

set.size – 셋에 몇 개의 값이 있는지 세줍니다.

 

셋 내에 동일한 값(value)이 있다면 set.add(value)을 아무리 많이 호출하더라도 아무런 반응이 없을 겁니다.

셋 내의 값에 중복이 없는 이유가 바로 이 때문이죠.

​

방문자 방명록을 만든다고 가정해 봅시다.

한 방문자가 여러 번 방문해도 방문자를 중복해서 기록하지 않겠다고 결정 내린 상황입니다.

즉, 한 방문자는 '단 한 번만 기록’되어야 합니다.

​

이때 적합한 자료구조가 바로 셋입니다.

let set = new Set();

let john = { name: "John" };
let pete = { name: "Pete" };
let mary = { name: "Mary" };

// 어떤 고객(john, mary)은 여러 번 방문할 수 있습니다.
set
  .add(john)
  .add(pete)
  .add(mary)
  .add(john)
  .add(mary); // 체이닝

// 셋에는 유일무이한 값만 저장됩니다.
alert( set.size ); // 3

for (let user of set) {
  alert(user.name); // // John, Pete, Mary 순으로 출력됩니다.
}

셋 대신 배열을 사용하여 방문자 정보를 저장한 후,

중복 값 여부는 배열 메서드인 arr.find를 이용해 확인할 수도 있습니다.

하지만 arr.find는 배열 내 요소 전체를 뒤져 중복 값을 찾기 때문에, 셋보다 성능 면에서 떨어집니다.

반면, 셋은 값의 유일무이함을 확인하는데 최적화되어있습니다.

​

---

Set의 값의 반복 작업

for..of나 forEach를 사용하면 셋의 값을 대상으로 반복 작업을 수행할 수 있습니다.

let set = new Set(["oranges", "apples", "bananas"]); // {"oranges", "apples", "bananas"}

for (let value of set) alert(value);

// forEach를 사용해도 동일하게 동작합니다.
set.forEach((value, valueAgain, set) => {
  alert(value);
});

흥미로운 점이 눈에 띄네요. forEach에 쓰인 콜백 함수는 세 개의 인수를 받는데,

첫 번째는 값, 두 번째도 같은 값인 valueAgain을 받고 있습니다. 세 번째는 목표하는 객체(셋)이고요.

즉, 동일한 값이 인수에 두 번 등장하고 있습니다.

​

이렇게 구현된 이유는 맵과의 호환성 때문입니다.

맵의 forEach에 쓰인 콜백이 세 개의 인수를 받을 때를 위해서죠.

이상해 보이겠지만 이렇게 구현해 놓았기 때문에 맵을 셋으로 혹은 셋을 맵으로 교체하기가 쉽습니다.

​

셋에도 맵과 마찬가지로 반복 작업을 위한 메서드가 있습니다.

set.keys() – 셋 내의 모든 값을 포함하는 이터러블 객체를 반환합니다.
set.values() – set.keys와 동일한 작업을 합니다. 맵과의 호환성을 위해 만들어진 메서드입니다.
set.entries() – 셋 내의 각 값을 이용해 만든 [value, value] 배열을 포함하는 이터러블 객체를 반환합니다. 맵과의 호환성을 위해 만들어졌습니다.

---

Reference

https://ko.javascript.info/map-set