[JavaScript] Set 객체(Set Object) 메서드 및 반복문 사용 방법

Set

 

셋(Set)이란?
ES6에 새롭게 추가된 자료구조로 현실 세계를 반영하기엔 객체(Object)와 배열(Array)  만으론 부족해서 
맵(Map)과 셋(Set) 이 등장하게 되었다. Set은 중복을 허용하지 않고, 키가 없는 값이 저장된다.

 

 

 

1. Set 주요 메서드 사용 방법

// Set 선언, 이터러블 객체를 전달받으면(대개 배열을 전달받음) 그 안의 값을 복사해 셋에 넣어준다.
let set =new Set(iterable)

// 값 추가
set.add(value)

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

// Set 내에 값이 존재하면 true, 아니면 false를 반환
set.has(value)

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

// Set에 몇 개의 값이 있는지 세준다.
set.size

• 같은 값을 set.add(value)로 아무리 많이 호출하더라도 중복이 방지되기 때문에 변화가 없다.

 

iterable 객체란?
반복 가능한(iterable, 이터러블)객체는 배열을 일반화한 객체입니다. 이터러블 이라는 개념을 사용하면 어떤 객체에든for..of 반복문을 적용할 수 있습니다.

 

 

 

---

2. Set 반복문 사용 방법

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

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

// key를 대상으로 순회합니다.
for(let key of set.keys()) {
  alert(key);
}

// value을 대상으로 순회합니다.
for(let value of set.values()) {
  alert(value);
}

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

 

 

2-1) forEach문 사용 가능

set.forEach((value, valueAgain, set) => {
  alert(value);
});

 첫 번째는 값, 두 번째도 같은 값인 valueAgain을 받고, 세 번째는 목표하는 객체(셋)이다. 
이렇게 동일한 값이 인수에 두 번 등장하는 이유는 맵과의 호환성 때문이다. 
맵의 forEach에 쓰인 콜백이 세 개의 인수를 받을 때를 위해서다. 이상해 보이겠지만 이렇게 구현해 놓았기 때문에 맵을 셋으로 혹은 셋을 맵으로 교체하기가 쉽습니다.

 

Set에 반복 작업을 할 땐, 값을 추가한 순서대로 반복 작업이 수행된다.(정렬) 그렇지만, Set 내 요소나 값을 재 정렬하거나 (배열에서 인덱스를 이용해 요소를 가져오는 것처럼) 숫자를 이용해 특정 요소나 값을 가지고 오는 것은 불가능하다.

 

 

 3. Array  →  Set,   Set  →  Array 변환하기

3-1) Array → Set

const arr = [0, 1, 2, 3];

let set = new Set(arr);
console.log(set); // Set(4) {0, 1, 2, 3}

 

3-2) Set →  Array

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

// 1. 전개 연산자 사용
const arr1 = [...set];
console.log(arr1); // [0, 1, 2, 3]

// 2. Array.from 사용
const arr2 = Array.from(set);
console.log(arr2); // [0, 1, 2, 3]

Array.from() 이란?
메서드는 유사 배열 객체나 반복 가능한 객체(iterable object)를 얕게 복사해 새로운 Array 객체를 만든다.