[JavaScript] Map

지난 학기 자스 스터디를 진행하면서 분명 많은 걸 얻었고 지금은 다 잃어버렸다.
코딩테스트를 준비하다가 보면 종종 Map을 이용해 복잡하게 구현하지 않는 것을 볼 수 있을 것이다. 간단한 요약과 함께 Map의 메서드들을 한번 살펴보자.
 

1. Map이 뭐였더라

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

구분	객체	Map 객체
키로 사용할 수 있는 값	문자열 또는 심벌 값	객체를 포함한 모든 값
이터러블	X	O
요소 개수 확인	Object.keys(obj).length	map.size

Map 객체의 중요한 특징으로는 중복 된 키를 가진 요소가 존재할 수 없다.
또한 Map 객체는 키 타입에 제한이 없다. 따라서 객체를 포함한 모든 값을 키로 사용할 수 있다.

2. Map 객체를 생성하는 방법

Map 객체는 Map 생성자 함수로 생성한다. Map 생성자 함수에 인수를 전달하지 않으면 빈 Map 객체이다.

const map = new Map();
console.log(map); // Map(0) {}

 

3. Map 객체의 요소 개수 확인

Map 객체의 요소 개수를 확인할 때는 Map.prototype.size를 이용한다.

const { size } = new Map([['key1', 'value1'], ['key2', 'value2']]);
console.log(size); // 2

 

4. Map 객체의 요소 추가

Map 객체에 요소를 추가할 때는 Map.prototype.set 메서드를 사용한다.
 

const map = new Map();
console.log(map);  // Map(0) {}

map.set('key1', 'value1');
console.log(map);	// Map(1) {"key1" => "value1"}

set 메서드는 새로운 요소가 추가된 Map 객체를 반환하기 때문에 method chaining이 가능하다. 하지만 그렇게 코딩테스트에서 구현하는 경우는 없을 것이다. 참고만 하자.
 

5. Map 객체 요소 취득

Map 객체에서 특정 요소를 취득하고자 할 때는 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
console.log(map.get('key'));	// undefined

 

6. Map 요소 존재 여부 확인

Map 객체에 특정 요소가 존재하는지 확인하기 위해선 Map.prototype.has 메서드를 사용한다. has 메서드는 요소의 존재 여부를 나타내는 불리언 값을 반환한다.

const lee = { name: 'Lee' }
const kim = { name: 'kim' }

const map = new Map([[lee, 'developer'], [kim, 'designer']]);

console.log(map.has(lee));	// true
console.log(map.has(kim));	// false

 

7. Map 요소 삭제

Map 객체의 요소를 삭제하려면 Map.prototype.delete를 사용한다. has 메서드와 같이 delete는 삭제 성공 여부의 불리언 값을 반환한다.

const lee = { name: 'Lee' }
const kim = { name: 'kim' }

const map = new Map([[lee, 'developer'], [kim, 'designer']]);

map.delete(kim);
console.log(map);	// Map(1) { {name: "Lee"} => "developer" }

만약 존재하지 않는 키로 Map 객체의 요소를 삭제하려하면 에러 없이 무시된다. 또한, 불리언 값을 반환하기에 set 메서드와 같이 method chaning이 불가 하다.
 

8. Map 요소 일괄 삭제

Map 객체의 요소를 일괄 삭제하려면 Map.prototype.clear 메서드를 사용한다. clear 메서드는 항상 undefined를 반환한다.
 

const lee = { name: 'Lee' }
const kim = { name: 'kim' }

const map = new Map([[lee, 'developer'], [kim, 'designer']]);

map.clear();
console.log(map);	// Map(0) {}