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', 'str1');   // 문자형 키
map.set(1, 'num1');     // 숫자형 키
map.set(true, 'bool1'); // 불린형 키

alert( map.get(1)   ); // 'num1'
alert( map.get('1') ); // 'str1'

alert( map.size ); // 3

객체와 다르게 키에도 자료형 제약이 없어서 map.get(1)과 map.get('1')의 리턴값이 서로 다르다.
객체와 다르게 맵은 객체를 키로 사용할 수도 있다.

let john = { name: "John" };

// 고객의 가게 방문 횟수를 세본다고 가정하자
let visitsCountMap = new Map();

// 객체인 john을 맵의 키로 사용
visitsCountMap.set(john, 123);

alert( visitsCountMap.get(john) ); // 123

✅ 맵요소에 반복 작업하기

map.keys() : 각 요소의 키를 모은 이터러블객체 반환
map.values() : 각 요소의 값을 모은 이터러블 객체 반환
map.entries() : 요소의 [키, 값]을 한 쌍으로 하는 이터러블 객체 반환

let recipeMap = new Map([
  ['cucumber', 500],
  ['tomatoes', 350],
  ['onion',    50]
]);

// 키(vegetable)를 대상으로 순회합니다.
for (let vegetable of recipeMap.keys()) {
  alert(vegetable); // cucumber, tomatoes, onion
}

// 값(amount)을 대상으로 순회합니다.
for (let amount of recipeMap.values()) {
  alert(amount); // 500, 350, 50
}

// [키, 값] 쌍을 대상으로 순회합니다.
for (let entry of recipeMap) { // recipeMap.entries()와 동일합니다.
  alert(entry); // cucumber,500 ...
}

Set이란? 🤔

중복이 없는 값을 저장할 때 쓰이는 자료구조
즉 set컬렉션 내의 값들은 서로 다르다

✅ 주요 메서드

new Set(iterable): set 생성. 이터러블 객체를 전달받으면 그 값을 복사해 셋에 넣어준다
set.add(value) : 값을 추가하고 셋 자신을 반환
set.delete(value) : 값 제거. 호출 시점에 셋 내에 값이 존재해 제거에 성공하면 ture, 그렇지 않으면 false를 반환
set.has(value) : 셋 내에 값이 존재하면 true, 아니면 false를 반환
set.clear() : 셋을 비움
set.size() : 요소의 개수 반환

동일한 값이 없고 한번만 저장해야할 때 set자료구조를 주로 사용한다. 다음 예시는 방문자 방명록을 만든다고 할 때, 한 방문자가 여러번 방문해도 중복해서 기록하지 않고 한번만 기록되어야 하기 때문에 set을 사용한 예시이다.
<예시>

let set = new Set();

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

// 어떤 고객(john, mary)은 여러 번 방문할 수 있다
set.add(john);
set.add(pete);
set.add(mary);
set.add(john);
set.add(mary);

// 셋에는 유일무이한 값만 저장된다
alert( set.size ); // 3

for (let user of set) {
  alert(user.name); // // John, Pete, Mary 순으로 출력된다
}

✅ 셋의 값에 반복 작업하기

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

let set = new Set(["oranges", "apples", "bananas"]);

for (let value of set) alert(value);

// forEach를 사용해도 동일하게 동작합니다.
set.forEach((value, valueAgain, set) => {
  alert(value);
});