[JSInfo] 맵과 셋

• 객체: 키가 있는 컬렉션을 저장함
• 배열: 순서가 있는 컬렉션을 저장함

하지만 두 자료구조만으로 부족해서 Map과 Set이 등장하게 됐습니다.

맵

Map은 키가 있는 데이터를 저장한다는 점에서 객체와 유사합니다. 하지만 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', 'KJ'); // 문자형 키
map.set(1, 'SJ'); // 숫자형 키
map.set(true, 'SH'); // 불린형 키

console.log(map.get(1)); // SJ 출력
console.log(map.get('1')); // KJ 출력
console.log(map.size); // 3 출력

console.log(map.get(true)); // SH 출력

맵은 키로 객체를 허용합니다.

객체를 키로 사용할 수 있다는 점은 맵의 가장 중요한 기능 중 하나입니다.
객체에는 문자열 키를 사용할 수 있습니다. 하지만 객체 키는 사용할 수 없습니다.

맵의 요소에 반복 작업하기

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

let fruitsMap = new Map([
    ['apple', 500],
    ['orange', 300],
    ['berry', 150]
]);

for(let fruit of fruitsMap.keys()){
    console.log(fruit); // 키를 반환 apple, oragne, berry
}

for(let price of fruitsMap.values()){
    console.log(price); // 값을 반환 500, 300, 150
}

for(let entry of fruitsMap){
    console.log(entry); // 키값을 반환 ['apple', 500] ['orange', 300], ...
}

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

각 요소가 키값 쌍인 배열이나 이터러블 객체를 초기화 용도로 맵에 전달해 새로운 맵을 만들 수 있습니다.

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

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

Object.entries를 사용해 객체 obj를 배열 [["name", "John"], ["age", 30]] 으로 바꾸고, 이 배열을 이용해 새로운 맵을 만들 수 있습니다.

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

let prices = Object.fromEntries([
	['banana', 1],
    ['orange', 2],
    ['apple', 4]
]);

console.log(prices.apple); // 4 출력

object.fromEntries를 사용해 맵을 객체로 바꿀 수 있습니다. 자료를 객체형태로 넘겨받길 원할 때 이 방법을 사용합니다.

셋

Set은 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션입니다.

셋의 주요 메소드

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

주의사항

셋 내에 동일한 값(value)가 있을 경우, set.add(value)를 아무리 많이 호출해도 중복값은 들어가지 않습니다.

게시판에 한 번만 글을 작성할 수 있는 경우 적잡한 구조가 셋입니다.

let set = new Set();

let john = { name: "John" };
let pete = { name: "Pete" };
let mary = { name: "Mary" };

set.add(john);
set.add(pete);
set.add(mary);
set.add(john);
set.add(mary);

console.log(set.size); // 3출력

for(let user of set){
	console.log(user.name); // John, Pete, Mary 출력
}

셋 값에 반복 작업하기

for...of 나 forEach를 사용하면 셋의 값을 대상으로 반복 작업을 수행할 수 있습니다.

(추가적인 공부가 필요하다..)

셋에도 맵과 마찬가지로 반복 작업을 위한 메소드가 있다.

• set.keys(): 셋 내의 모든 값을 포함하는 이터러블 객체를 반환합니다.
• set.values(): set.keys와 동일한 작업을 합니다. 맵 과의 호환성을 위해 만들어진 메소드입니다.
• set.entries(): 셋 내의 각 값을 이용해 만든 배열을 포함한 이터러블 객체를 반환합니다. 맵과의 호환성을 위해 만들어졌습니다.