#JavaScript Grammar_Map과 Set

# Map이란? 

Map은 key-value pair를 저장하는 객체와 비슷함. 

객체와 달리 key로 사용할 수 있는 모든 유형을 사용가능. 

key가 정렬된 순서로 저장되기 땨문에, 추가한 순서로 반복할 필요가 없음. 

 

# Map의 작업 수행

1) key-value pair 추가 및 검색(set)

2) key-value pair 삭제

3) 모든 key-value pair 제거(clear)

4) Map 크기 및 존재 여부 확인(size)

 

#***Map 주요 메서드와 프로퍼티

1) new Map()  – 맵을 만듬.
2) map.set(key, value)  –  key 를 이용해 value 를 저장. 
3) map.get(key)  –  key 에 해당하는 값을 반환하고 key 가 존재하지 않으면 undefined 를 반환.
4) map.has(key)  –  key 가 존재하면 true, 존재하지 않으면 false 를 반환.
5) map.delete(key)  –  key 에 해당하는 값을 삭제.
6) map.clear()  – 맵 안의 모든 요소를 제거.
7) map.size  – 요소의 개수를 반환.

 

# Map의 생성 및 사용

`new Map()`을 사용하여 새로운 Map 객체를 만듬.

`set()` 메서드를 사용하여 특정 키와 값을 Map에 추가.

`get()` 메서드를 사용하여 지정한 키에 해당 값을 가져옴. 

// 새로운 Map을 만들려면 Map() 생성자를 사용
const myMap = new Map();

// Map에 값을 추가하려면 set() 메소드를 사용
myMap.set('key', 'value');

// Map에서 값을 검색하려면 get() 메소드를 사용
console.log(myMap.get('key')); // 'value' 출력

1) 예제에서 `myMap`은 `key`라는 키와 `value`라는 값을 가진 Map을 나타냄. 

2) `myMap.get('key')`를 호출하여 `key`에 해당하는 `value`를 검색하고 출력함.

3) 결과로 `value`가 출력됨.

=>  `Map` 객체는  key-value pair를 저장하고 효육적으로 관리할 수 있음. 

=>  객체 키를 사용할 때 다른 자바스크립트 객체와 구별이 유용함. 

 

 

# Map의 반복

Map에서는 keys(), values(), entries() 메소드를 사용하여  key, value 및  key-value pair를 쌍으로 반복할 수 있음. 

 

#***for ...of 반복문

for of 반복문은 ES6에 추가된 전용 반복 구문임.

for of 구문을 사용하기 위해선 컬렉션 객체가 [symbol.iterator] 속성을 가지고 있어야만 함. (직접 명시 가능).

var iterable = [10, 20, 30];
for (var valueof iterable) {
console.log(value);// 10, 20, 30
}

/* +++iterator는 반복자라는 뜻
요소 하나하나를 반복할 수 있도록 배열 또는 객체와 비슷한 형태로 열거되어있는 자료구조
아래 예시 코드에서myMap.keys() 으로 쓸 수 있는 이유는 myMap.key() 가 반환하는 값이 iterator이기 때문 */

const myMap = new Map();
myMap.set('one', 1);
myMap.set('two', 2);
myMap.set('three', 3);

// 키 순회
for (const key of myMap.keys()) {
console.log(key);
}
/* 출력:
'one'
'two'     
'three'      
*/

// 값 순회
for (const value of myMap.values()) {
console.log(value);
}
/* 출력:
1
2  
3      
*/

// 엔트리 순회 (키와 값의 쌍)
for (const entry of myMap.entries()) {
console.log(`${entry[0]}: ${entry[1]}`);
}
/* 출력:
'one : 1'
'two : 2'     
'three : 3'      
*/

-  `Map` 객체를 생성하고 `Set` 메서드를 사용하여 키와 값을 저장.

-  `myMap.keys()` 메서드를 사용하여 `Map` 객체의 키를 순회하고 각 키를 출력.

-  `myMap.vlaues()` 메서드를 사용하여 `Map` 객체의 값들을 순회하고 각 값을 출력.

-  `myMap.entries()` 메서드를 사용하여 `Map` 객체의 키와 값의 쌍을 순회하고 각 쌍을 출력.

=> `Map` 객체는 키와 값 사이의 관계를 쉽게 관리하고, 순회 및 검색시 효율적 자료구조로 활용함.  

 

# Map의 크기 및 존재 여부 확인

Map의 크기를 확인하려면 size 속성을 사용

//# Map의 반복내용과 이어짐
console.log(myMap.size); // 3 출력

특정 키가 Map에 존재하는지 여부를 확인하려면 has()메소드를 사용.

//#***for ...of 반복문 내용과 이어짐
console.log(myMap.has('two')); // true 출력
console.log(myMap.has('two22')); // false 출력

 

---

 

# Set이란? 

set은 고유한 값을 저장하는 자료구조.

주로 값만 저장하며, 키를 저장하지 않음.

값이 중복되지 않는 유일한 요소로만 구성됨. 

 

# Set의 작업 수행

1) 값 추가 및 검색

2) 값 삭제

3) 모든 값 제거 

4) set 크기 및 존재 여부 확인  

 

# Set의 생성 및 사용

`new Set()`을 사용하여 새로운 Set객체를 만듬. 

`add()` 메서드를 사용하여 Set에 값을 추가.

`has()` 메서드를 사용하여 Set에 특정 값을 검색.

// 새로운 Set 을 만들려면 Set() 생성자를 사용
const mySet = new Set();

// 이제 Set 에 값을 추가하려면 add() 메소드를 사용
mySet.add('value1'); mySet.add('value2');

//Set 에서 값을 검색하려면 has() 메소드를 사용
console.log(mySet.has('value1')); // true 출력

1) 예제에서 `mySet`은 `value1`과 `value2`라는 두 값을 가진 Set을 나타냄.

2) `mySet.add('value1')` 및 `mySet.add('value2')`를 사용하여 값을 Set에 추가.

3) `mySet.has('value1')`를 호출하여 `value1` 값이 Set 내에 있는지 확인하고 `true`를 출력.

=> `Set` 객체는 중복되 값을 허용하지 않으며, 값을 고유하게 유지하는데 유용함. 

=> 중복을 제거하거나 고유한 값의 집합을 관리하는데 도움이 됨. 

 

# Set의 반복

Set에서는 values() 메소드를 사용하여 값을 반복할 수 있음. 

const mySet = new Set();
mySet.add('value1');
mySet.add('value2');
mySet.add('value3');

for (const value of mySet.values()) {
console.log(value);
}
/* 출력:
value1
value2
value3
*/

에제에서 `Set` 객체를 사용하여  set을 만들고 값을 추가한 다음 `for..of` 루프를 사용하여 Set 내의 값을 순회하고 출력하는 방법을 제시.

1) `new Set()`을 사용하여 새로운 Set 객체를 만듬. 

2) `add()` 메서드를 사용하여 Set에 `value1`, `value2` 및 `value3`의 값을 추가.

3) `for...of` 루프를 사용하여 `mySet.vvalues()`를 통해 Set 내의 값을 순회.

4) 각 값을 `console.log()`를  사용하여 출력. 

=> 결론: `Set`객체 중복을 허용치 않는 고유한 값의 컬렉션을 만들고 관리할 수 있으며, 효율적으로 순회 및 처리. 

 

# Set의 크기 및 존재 여부확인

Set의 크기를  확인하려면 size 속성을 사용.

//# Set의 반복내용과 이어짐
console.log(mySet.size); // 3 출력

특정 값을 set에서 검색하여 존재하는지 여부를 확인하려면 has() 메소드를 사용.

//# Set의 반복내용과 이어짐
console.log(mySet.has('value2')); // true 출력
console.log(mySet.has('value52')); // flase 출력

 

---

 

# 결론 

 1) JavaScript에서 `Map`과 `Set`은 다른 유형의 자료 구조.

 2) `Map`은 key-value pair를 저장하는 객체와 비슷

 3) `Set`은 고유한 값을 저장하는 자료 구조.

 4) `Map`과 `Set`은 모두 값 추가, 검색, 삭제 및 모든 값 제거를 수행할 수 있음.