Search

Set과 Map

37.1 Set

Set 객체는 중복되지 않는 유일한 값들의 집합입니다. Set 객체는 배열과 유사하지만 차이가 있습니다.

37.1.1 Set 객체의 생성

Set 객체는 Set 생성자 함수로 생성합니다.
const set = new Set(); console.log(set); // Set(0) {}
JavaScript
복사
Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체를 생성합니다. 이때 이터러블의 중복된 값은 Set 객체에 요소로 저장되지 않습니다.
const set1 = new Set([1, 2, 3, 3]); console.log(set1); // Set(3) {1, 2, 3} const set2 = new Set('hello'); console.log(set2); // Set(4) {"h", "e", "l", "o"}
JavaScript
복사

37.1.2 요소 개수 확인

Set 객체의 요소 개수를 확인 할 때는 Set.prototype.size 프로퍼티를 사용합니다. 이때 size 프로퍼티는 setter 함수 없이 getter 함수만 존재하는 접근자 프로퍼티입니다. 따라서 size프로퍼티에 숫자를 할당하여 Set 객체의 요소 개수를 변경할 수 없습니다.
const set = new Set([1, 2, 3]); console.log(Object.getOwnPropertyDescriptor(Set.prototype, 'size')); set.size = 10; console.log(set.size); // 3
JavaScript
복사

37.1.3 요소 추가

Set 객체에 요소를 추가할 때는 Set.prototype.add 메서드를 사용합니다. 이는 중복으로 사용도 가능하며, NaN과 NaN도 중복으로 평가하고, +0, -0도 일치 연산자와 마찬가지로 같다고 판단하여 중복을 허용하지 않습니다.
const set = new Set(); set.add(NaN).add(NaN); set.add(0).add(-0); console.log(set); // Set(2) {NaN, 0}
JavaScript
복사

37.1.4 요소 존재 여부 확인

Set 객체에 특정 요소가 존재하는지 확인하려면 Set.prototype.has 메서드를 사용합니다.
const set = new Set([1, 2, 3]); console.log(set.has(2)); // true console.log(set.has(4)); // false
JavaScript
복사

37.1.5 요소 삭제

Set 객체의 특정 요소를 삭제하려면 Set.prototype.delete 메서드를 사용합니다. 이때 성공 여부를 불리언 값으로 나타냅니다. 또한 성공 여부를 boolean 값을 반환하기 때문에 연속적으로 호출할 수 없습니다.
const set = new Set([1, 2, 3]); set.delete(2); console.log(set); // set(2) {1, 3} set.delete(0); console.log(set); // set(2) {1, 3} set.delete(0).delete(1); // TypeError
JavaScript
복사

37.1.6 요소 일괄 삭제

Set 객체의 모든 요소를 일괄 삭제하려면 Set.prototype.clear 메서드를 사용합니다. 이는 언제나 undefined를 반환합니다.
const set = new Set([1, 2, 3]); set.clear(); consol.log(set); // Set(0) {}
JavaScript
복사

37.1.7 요소 순회

forEach메서드를 통해서 요소를 순회 할 수 있습니다. 3개의 인수를 전달 받는데
현재 순회 중인 요소값
현재 순회 중인 요소값
현지 순회 중인 Set객체 자체
첫째와 둘째는 인수가 같은데, Arrayt.prototype.forEach 메서드와 인터페이스를 통일하고자 함입니다.
const set = new Set([1, 2, 3]); set.forEach((v, v2, set) => console.log(v, v2, set)); /* 1 1 Set(3) {1, 2, 3} 2 2 Set(3) {1, 2, 3} 3 3 Set(3) {1, 2, 3} */
JavaScript
복사
Set 객체는 이터러블입니다 .따라서 for…lof문으로도 순회할 수 있고, 스프레드 문법과 디스트럭처랑의 대상이 될 수 있습니다.

37.2 Map

Map 객체는 키와 값의 쌍으로 이루어진 컬렉션입니다. Map 객체는 객체와 유사하지만 차이가 있습니다.

37.2.1 Map 객체의 생성

Map 생성자 함수를 통해서 생성할 수 있습니다. Map 생성자 함수는 이터러블을 인수로 전달받아 Map 객체를 생성합니다. 이때 인수로 전달되는 이터러블은 키와 값의 쌍으로 이루어진 요소로 구성되어야 합니다.
const map1 = new Map(['key1', 'value1'], ['key2', 'value2']); console.log(map1); // Map(2) {"key1" => "value1", "key2" => "value2"} const map2 = new Map([1, 2]); // TypeError
JavaScript
복사
만약 중복된 키를 갖는 요소가 존재하면 값이 덮어써져 중복된 키를 갖는 요소는 존재할 수 없습니다.

37.2.2 요소 개수 확인

Map.prototype.size 프로퍼티를 사용합니다. 이는 setter 함수 없이 getter 함수만 존재하는 접근자 프로퍼티이기 때문에 요소 갯수를 변경할 수 없습니다.
const map = new Map([['key1', 'value1'], ['key2', 'value2']]); map.size = 10; // 무시됨 console.log(map.size); // 2
JavaScript
복사

37.2.3 요소 추가

Map 객체에 요소를 추가할 때는 Map.prototype.set 메서드를 사용합니다. 이때 set 메서드는 새로운 요소가 추가된 Map 객체를 반환하기 때문에 연속적으로 호출 할 수 있습니다.
const map = new Map(); map.set('k1', 'v1').set('k2', 'v2'); console.log(map); // Map(2) {'k1' => 'v1', 'k2' => 'v2'}
JavaScript
복사
NaN이나 +-0에 대해서는 Set과 동일하게 평가합니다.
객체의 경우엔 문자열이나 심벌 값만 키로 사용할 수 있는데, Map 객체는 키 타입에 제한이 없습니다. 따라서 객체를 포함한 모든 것을 키로 사용할 수 있습니다.

37.2.4 요소 취득

Map.prototype.get을 사용하는데 인수로 키를 전달 시 값을 반환합니다. 만약 값이 없을 시 undefined를 반환합니다.
const map = new Map(); const lee = { name: 'Lee' }; const kim = { name: 'Kim' }; map.set(lee, 'developer').set(kim, 'designer'); console.log(map.get(lee); // developer
JavaScript
복사

37.2.5 요소 존재 여부 확인

has 메서드를 사용하면 불리언 값을 반환합니다.

37.2.6 요소 삭제

Map.prototype.delete 메서드를 사용하면 삭제 성공 여부가 불리언 값이 반환됩니다.

37.2.7 요소 일괄 삭제

Map 객체의 요소를 일괄 삭제하려면 Map.prototype.clear 메서드를 사용합니다. 언제나 undefined를 반환합니다.

37.2.8 요소 순회

set과 동일하게 forEach를 사용하는데 인자의 경우 조금 다릅니다
현재 순회 중인 요소값
현재 순회 중인 요소키
현지 순회 중인 Map 객체 자체
const lee = {name: 'Lee'}; const kim = {name: 'Kim'}; const map = new Map([[lee, 'developer'], [kim, 'designer']]); map.forEach((v, k, map) => console.log(v, k, map)); /* developer {name: 'Lee'} Map(2) {{…} => 'developer', {…} => 'designer'} designer {name: 'Kim'} Map(2) {{…} => 'developer', {…} => 'designer'} */
JavaScript
복사
Map 객체는 이터러블이여서 for…of 문으로 순회할 수 있으며, 스프레드 문법과 배열 디스트럭처링 할당의 대상이 될 수 있습니다.
Map 객체는 이터러블이면서 동시에 이터레이터인 객체를 반환하는 메서드를 제공합니다.
Map객체의 경우 순서에 의미를 갖지는 않지만 추가된 순서를 따릅니다.