[JSInfo] Map & Set

Map 과 Set을 이해하기전 객체와 배열에 대한 이해가 필요합니다.

객체 : 키가 있는 컬렉션을 저장합니다.
배열 : 순서가 있는 컬렉션을 저장합니다.

하지만 기능이 부족하여 Map 과 Set을 사용하게됐습니다.

Map

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

Map Method

• new Map() : 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 : 요소의 개수를 반환합니다.

ex) Map 사용 예시

let map = new Map();
map.set('1', 'str1');
map.set(1, 'num1');
map.set(true, 'bool1');

console.log(map.get(1)); // 'num1' 출력
console.log(map.get('1'); // 'str1' 출력

console.log(map.size); // 3

주의 사항

map을 사용할 때는 키값을 설정하고 불러올 때 set, get 만 사용하는 것이 좋습니다.

Map 요소에 반복 작업하기

• map.keys() : 각 요소의 키를 모은 반복 가능한 (iterable)객체를 반환합니다.
• map.values() : 각 요소의 값을 모은 iterable 객체를 반환합니다.
• map.entries() : 요소의 [키, 값]을 한 쌍으로 하는 iterable 객체를 반환합니다.

ex)

let drinkMap = new Map([
	['Soju', 5000],
    ['Beer', 4000],
    ['Water', 1000],
]);

for(let drink of drinkMap.key()){
	console.log(drink); // Soju, Beer, Water 출력
};

for(let price of drinkMap.values()){
	console.log(price); // 5000, 4000, 1000 출력
}

for(let menu of drinkMap){
	console.log(menu);
} // Soju, 5000, Beer, 4000, Water, 1000 출력

맵은 값이 삽입된 순서를 기억하고 순서대로 실시합니다.

Object.entries: 객체를 맵으로 바꾸기

let obj = {
	name: "KJ",
    age: 31
};

let map = new Map(Object.entries(obj));
console.log(map.get('name')); // KJ 출력

Object.entries를 사용해 객체 obj를 배열로 바꾸고, 이 배열을 이요해 새로운 맵을 만들 수 있습니다.

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

위와 상반된 개념입니다.

let prices = Object.fromEntries([
	['Soju', 1],
    ['Beer', 2],
    ['Water', 4]
]);

console.log(prices.Soju); // 1출력

Set

Set은 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션입니다. 셋은 키가 없는 값이 저장됩니다.

• new Set(iterable) : 셋을 만듭니다. iterable 객체를 전달받을 경우 배열을 전달받습니다. 그 안의 값을 복사해 셋을 더해줍니다.
• set.add(value) : 값을 추가하고 Set 자신을 반환합니다.
• set.delete(value) : 값을 제거합니다. 호출 시점에 셋 내에 값이 있어야 가능합니다. 제거에 성공하면 true, 실패하면 false를 반환합니다.
• set.has(value) : Set 내에 값이 존재하면 true, 아니면 false를 반환합니다.
• set.clear() : Set을 비웁니다.
• set.size : Set에 몇개의 값이 있는지 확인합니다.

주의 사항

set.add(value) 사용시 동일한 값이 있다면 아무 반응이 없습니다.
중복값을 허용하지 않는 상황에서는 Set을 사용합니다.

let set = new Set();

let KJ = {name: "KJ"};
let SJ = {name: "SJ"};
let SH = {name: "SH"};

set.add(KJ);
set.add(SJ);
set.add(SH);
set.add(SY);
set.add(KO);

console.log(set.size); // 3 (SY와 KO는 별도 선언이 없어 추가가 안된다.);

for(let user of set){
	console.log(user.name);
    // KJ, SJ, SH 출력
}

Set의 장점은 유일하다.(Unique)입니다. 중복값이 있을까 걱정할 필요가 없습니다.

Set 값에 반복 작업하기

for...of 나 forEach를 사용하면 Set값을 반복할 수 있습니다.

ex)for...of

let set = new Set(['KJ', 'SJ', 'ET']);

for(let value of set);

console.log(value);

ex) forEach

let set = new Set(['KJ', 'SJ', 'ET']);

set.forEach((value, valueAgain, set) => {
	console.log(value);
});

• set.keys() : Set 내의 모든 값을 포함하는 iterable 객체를 반환합니다.
• set.values() : set.keys와 동일한 작업을 합니다. (Map과 호환을 위해 만들어진 메소드입니다.)
• set.entries() : Set내의 각 값을 [value, value] 배열을 포함하는 iterable 객체를 반환합니다.

결론..

훑어본 결과.. 무슨 말인지 모르겠으니까, 나중에 다시 한 번 정리하자.