Map

내가 진행한 웹 프로젝트에서는 거의 쓰지 않는거 같은데... 

 

React와 React Native를 잠간 보니.. 그래도 꽤 쓰는거 같아.. 미리 개념을 정리 해 둔다.

 

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);
map.set('2', 2);
map.set('3', 3);

console.log(map.get('3'));

* 맵은 객체를 키로 허용함

let lee = {name : "Lee"};
let leeMap = new Map();
leeMap.set(lee, 45);
console.log(leeMap.get(lee));

* 체이닝

 - map.set을 호출할 때마다 맵 자신이 반환됨

map.set('1', 1)
        .set('2', 2)
        .set('3', 3)

* 맵 반복

• map.keys() : 각 요소의 키를 모은 반복 가능한 객체를 반환(iterable)
• map.values() : 각 요소의 값을 모은 객체를 반환(iterable)
• map.entries() : 요소의 [key, value]을 한 쌍으로 하는 iterable 객체를 반환. for ... of  반복문에 쓰임 

let fruitMap = new Map([
    ['apple', 1000]
    , ['banana', 5000]
    , ['melon', 10000]
]);

for (let fruit of fruitMap.keys()){
    console.log(fruit);
}

for (let price of fruitMap.values()){
    console.log(price);
}

for (let fruit of fruitMap){
    console.log(fruit);
}

* map.forEach

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

* 객체를 맵으로 변경 : Object.entries 사용

let obj = { name : "Lee", age : 45 };

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

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

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

let map = new Map();
map.set('apple', 1000);
map.set('banana', 2000);
map.set('melon', 3000);

let fruit = Object.fromEntries(map.entries());

console.log(fruit.banan);