[Javascript] ES6 Map, Set

평소 Object와 Array만 쓰다가 회사 입사 후 동료의 Map, Set 사용에 ES6 새로 추가된 Map, Set을 간단히 정리해보려고 한다.

Map

Map은 Object와 상당히 유사한 객체로 Object와 달리 넣은 key-value 쌍의 순서 가 기억되고 key가 문자열이 아니어도 된다.
Map 객체는 요소의 삽입 순서대로 원소를 순회하며 for...of 반복문은 각 순회에서 [key, value] 로 이루어진 배열을 반환한다.

Map 활용

let myMap = new Map();
let keyString = "문자열";
let keyObj = {};
let keyFunc = function() {};

//값 설정
myMap.set(keyString, "문자열의 값");
myMap.set(keyObj, "object의 값");
myMap.set(keyFunc, "func의 값");

myMap.size //3

//getting the values
myMap.get(keyString); //문자열의 값
myMap.get(keyObj); //object의 값

for...of 사용

let myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");

for (let [key, value] of myMap) {
  console.log(key + " = " + value);
}
//0 = zero
//1 = one

for (let value of myMap.vlues()) {
  console.log(value);
}
//zero
//one

for (let [key, value] of myMap.keys()) {
  console.log(key);
}
// 0
// 1

Set

Set은 Array와 비슷하지만 Array와 달리 값이 중복될 수 없다. Set 객체는 Map과 마찬가지로 삽입 순서대로 요소를 순회할 수 있다.

Set 활용

let mySet = new Set();
mySet.add(1);
mySet.add(5);
mySet.add("some text");
mySet.add({ a: 1, b: 2});

mySet.has(1); //true;
mySet.has(3); //false;

mySet.size; //4

mySet.delete(5);
mySet.has(5); //false

Set 반복

// 위의 내용 이어서

for (let item of mySet) {
	console.log(item);
}
//1
//some text
//{a:1, b:2}

for (let item of mySet.keys()) {
	console.log(item);
}
//1
//some text
//{a:1, b:2}