[JavaScript 최신 기능 시리즈] 7일차: JavaScript의 새로운 빌트인 객체들: Map, Set 이해하기

7. 새로 추가된 빌트인 객체들 (Map, Set 등)

새로운 빌트인 객체란 무엇인가?

ES6에서는 기존의 객체(Object)와 배열(Array) 외에 새로운 자료 구조인 Map과 Set을 도입했습니다. 이들은 각각 키-값 쌍과 고유한 값의 집합을 관리하는 데 유용합니다.

Map 객체

Map 객체는 키-값 쌍을 저장하며, 모든 데이터 유형을 키로 사용할 수 있습니다.

1. Map 생성

let map = new Map();

2. 요소 추가

map.set('name', 'Alice');
map.set('age', 25);

console.log(map);  // 출력: Map(2) {"name" => "Alice", "age" => 25}

3. 요소 접근

console.log(map.get('name'));  // 출력: Alice
console.log(map.get('age'));   // 출력: 25

4. 요소 존재 확인

console.log(map.has('name'));  // 출력: true
console.log(map.has('gender'));  // 출력: false

5. 요소 삭제

map.delete('age');
console.log(map);  // 출력: Map(1) {"name" => "Alice"}

6. 요소 개수 확인

console.log(map.size);  // 출력: 1

7. 모든 요소 제거

map.clear();
console.log(map.size);  // 출력: 0

8. Map 순회

map.set('name', 'Alice');
map.set('age', 25);

for (let [key, value] of map) {
  console.log(`${key}: ${value}`);
}
// 출력: 
// name: Alice
// age: 25

Set 객체

Set 객체는 고유한 값들의 집합을 저장합니다. 동일한 값이 중복되지 않도록 관리합니다.

1. Set 생성

let set = new Set();

2. 요소 추가

set.add(1);
set.add(2);
set.add(2);  // 중복된 값은 추가되지 않음

console.log(set);  // 출력: Set(2) {1, 2}

3. 요소 존재 확인

console.log(set.has(1));  // 출력: true
console.log(set.has(3));  // 출력: false

4. 요소 삭제

set.delete(1);
console.log(set);  // 출력: Set(1) {2}

5. 요소 개수 확인

console.log(set.size);  // 출력: 1

6. 모든 요소 제거

set.clear();
console.log(set.size);  // 출력: 0

7. Set 순회

set.add('Apple');
set.add('Banana');
set.add('Cherry');

for (let item of set) {
  console.log(item);
}
// 출력: 
// Apple
// Banana
// Cherry

WeakMap과 WeakSet

WeakMap과 WeakSet은 가비지 컬렉션을 지원하는 특별한 형태의 Map과 Set입니다. 키와 값이 약한 참조로 연결되어 있어, 참조가 사라지면 가비지 컬렉션의 대상이 됩니다.

1. WeakMap

let weakMap = new WeakMap();
let obj = {};

weakMap.set(obj, 'value');
console.log(weakMap.get(obj));  // 출력: value

obj = null;
// weakMap에서 obj에 대한 참조가 사라지고, 가비지 컬렉션에 의해 메모리 해제 가능

2. WeakSet

let weakSet = new WeakSet();
let obj = {};

weakSet.add(obj);
console.log(weakSet.has(obj));  // 출력: true

obj = null;
// weakSet에서 obj에 대한 참조가 사라지고, 가비지 컬렉션에 의해 메모리 해제 가능

결론

ES6에서 도입된 Map, Set, WeakMap, WeakSet 객체는 더 다양한 데이터 구조를 제공하여 JavaScript 개발을 더욱 유연하고 효율적으로 만들어줍니다. 이 객체들을 활용하여 데이터 관리와 성능을 향상시킬 수 있습니다.

이로써 JavaScript 최신 기능 시리즈를 마치게 되었습니다. 이 시리즈를 통해 ES6 이후 도입된 다양한 기능을 이해하고, 이를 실제 코드에 적용할 수 있기를 바랍니다.