[Node.js] Map 사용법

맵과 Obejct의 각각 특징

object 특징

• object는 key값으로 String만 사용가능하다.
• object는 순서를 보장하지 않는다.
• 수동으로 크기를 구해야한다.
  ex) Object.keys(obj).length
• object는 프로토타입을 가지기 때문에 유의하여 사용해야한다.

Map 특징

• Map객체는 ECMAScript 6에서 값들을 매핑하기 위해 나온 새로운 데이터 구조이다.
• Map은 키값으로 모든 값을 가질 수 있다.
• Map은 삽입된 순서대로 반복된다 => 안정성 보장
• size 속성을 통하여 쉽게 크기를 구할 수 있다.

---

Object와 Map 사용 시점 판단

MDN 문서에서는 다음과 같이 설명한다.

실행 시까지 키를 알수 없고, 모든 키가 동일한 type이며 모든 값들이 동일한 type일 경우에는 objects를 대신해서 map을 사용해라.
각 개별 요소에 대해 적용해야 하는 로직이 있을 경우에는 objects를 사용해라.

Object 사용 시점

• 각 요소에 대해서 별도의 로직이 필요한 경우

Map 사용 시점

• key와 value가 각각 같은 타입인 경우
• 런타임까지 key가 정해지지 않은 경우
• 데이터의 크기가 큰경우 (일반적으로 더 좋은 성능을 보인다고 한다)
• 안정성을 유지해야 할때 (순서의 보장)

---

맵

맵(Map)은 키가 있는 데이터를 저장한다는 점에서 객체와 유사하지만 맵은 키에 다양한 자료형을 허용한다는 점에서 차이가 있습니다.

맵에는 다음과 같은 주요 메서드와 프로퍼티가 있습니다.

• new Map() – 맵을 만듭니다.
• map.set(key, value) – key를 이용해 value를 저장합니다.
• map.get(key) – key에 해당하는 값을 반환합니다. key가 존재하지 않으면 undefined를 반환합니다.
• map.has(key) – key가 존재하면 true, 존재하지 않으면 false를 반환합니다.
• map.delete(key) – key에 해당하는 값을 삭제합니다.
• map.clear() – 맵 안의 모든 요소를 제거합니다.
• map.size – 요소의 개수를 반환합니다.

let map = new Map();

map.set("1", "1 String"); // 문자형 키
map.set(1, "1 Number"); // 숫자형 키
map.set(true, "1 Boolean"); // 불린형 키

// 객체는 키를 문자형으로 변환하지만
// 맵은 키의 타입을 변환시키지 않고 그대로 유지합니다. 따라서 아래의 코드는 출력되는 값이 다릅니다.
console.log(map.get(1)); // '1 Number'
console.log(map.get("1")); // '1 String'
console.log(map.get(true)); // '1 Boolean'
console.log(map.size); // 3

/*출력
1 Number
1 String
1 Boolean
3
*/

맵은 객체와 달리 키를 문자형으로 변환하지 않고, 키엔 자료형 제약이 없습니다.

🧨주의 사항

map[key]는 Map을 쓰는 바른 방법이 아닙니다.
map[key] = 2로 값을 설정하는 것 같이 map[key]를 사용할 수 있긴 합니다.
하지만 이 방법은 map을 일반 객체처럼 취급하게 됩니다.
따라서 여러 제약이 생기기 때문에 map을 사용할 땐 map전용 메서드 set, get 등을 사용해야만 합니다.

---

Map set 체이닝

map.set을 호출할 때마다 맵 자신이 반환됩니다.
이를 이용하여 map.set을 '체이닝(chaining)'할 수 있습니다.

map.set("1", "1 String").set(1, "1 Number").set(true, "1 Boolean");

console.log(map.get(1)); // '1 Number'
console.log(map.get("1")); // '1 String'
console.log(map.get(true)); // '1 Boolean'
console.log(map.size); // 3

/*출력
1 Number
1 String
1 Boolean
3
*/

---

Map 메서드 사용

let map = new Map();
map.set("1", "1 String").set(1, "1 Number").set(true, "1 Boolean");

console.log(map.size); // 3
console.log(map.has(1)); // true

console.log(map); // Map(3) { '1' => '1 String', 1 => '1 Number', true => '1 Boolean' }

console.log(map.delete(1)); // true
console.log(map.has(1)); // false
console.log(map); // Map(2) { '1' => '1 String', true => '1 Boolean' }

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

/*
출력
3
true
Map(3) { '1' => '1 String', 1 => '1 Number', true => '1 Boolean' }
true
false
Map(2) { '1' => '1 String', true => '1 Boolean' }
Map(0) {}
*/

맵의 요소에 반복 작업하기

• map.keys() – 각 요소의 키를 모은 반복 가능한(iterable, 이터러블) 객체를 반환합니다.
• map.values() – 각 요소의 값을 모은 이터러블 객체를 반환합니다.
• map.entries() – 요소의 [키, 값]을 한 쌍으로 하는 이터러블 객체를 반환합니다. 이 이터러블 객체는 for..of반복문의 기초로 쓰입니다.

let map = new Map();
map.set("1", "1 String").set(1, "1 Number").set(true, "1 Boolean");

console.log(map.keys());
console.log(map.values());
console.log(map.entries());

for (let i of map.keys()) {
  console.log(i);
}

for (let i of map.values()) {
  console.log(i);
}

for (let i of map.entries()) {
  console.log(i);
}

/* 출력
[Map Iterator] { '1', 1, true }
[Map Iterator] { '1 String', '1 Number', '1 Boolean' }
[Map Entries] {
  [ '1', '1 String' ],
  [ 1, '1 Number' ],
  [ true, '1 Boolean' ]
}
1
1
true
1 String
1 Number
1 Boolean
[ '1', '1 String' ]
[ 1, '1 Number' ]
[ true, '1 Boolean' ]
*/

let map = new Map();
map.set("1", "1 String").set(1, "1 Number").set(true, "1 Boolean");

map.forEach((item, key) => console.log(`${key} : ${item}`));

/*
출력
1 : 1 String
1 : 1 Number
true : 1 Boolean
*/

---

객체[ Object ]를 Map으로 바꾸기

평범한 객체를 가지고 맵을 만들고 싶다면 내장 메서드 Object.entries(obj)를 활용해서 객체의 키-값 쌍을 요소([key, value])로 가지는 배열로 만들어줍니다.

let obj = {
  name: "John",
  age: 30,
};

let map = new Map(Object.entries(obj));

console.log(map);
console.log(map.get("name"));

/*
출력
Map(2) { 'name' => 'John', 'age' => 30 }
John
*/

---

Object.fromEntries: 맵을 객체로 바꾸기

let map = new Map();
map.set("name", "Shin").set("age", "26").set(true, "1 Boolean");

//let obj = Object.fromEntries(map.entries()); // 아래와 같은 동작
let obj = Object.fromEntries(map); 
console.log(obj);

/*
출력
{ name: 'Shin', age: '26', true: '1 Boolean' }
*/

---