JS NORMAL | Map, Set

Collection

Indexed Collection : Array, Typed Array
Keyed Collection : Object -> Map, Set

---

💻 Map

• 어떤 배열에 있는 모든 요소들의 값을 변경해서 만든 새로운 배열을 써야 할 때, 콜백 함수를 이용하여 각각의 요소에 호출해서 그 값을 변환할 수 있게 한다.
• 다양한 자료형의 key를 허용하고, key-value 형태의 자료형을 저장할 수 있는 collection

const arr = [1,4,8,10];
const map = arr.map(function(element){ return element * 2);
console.log(map); //[2,8,16,20];

생성

new Map()

요소 추가/ 삭제

Map.set(key,value) 요소 추가
Map.get(key) 요소 접근
Map.delete(key) 요소 삭제
Map.clear() 전체 삭제

let map = new Map();

map.set("name", "John");
console.log(map.get("name"); //output: john
map.delete("name");
map.clear();

기타 메소드

Map.size 개수 확인
Map.has(key) 요소 존재 여부 확인
Map.keys() Map.values() Map.entires()

Map의 반복문 활용

collection 객체인 Map 이 가지고 있는 iterator 속성을 이용하여 for … of 구문을 통해 반복문 수행 가능하다.

let recipe_juice = new Map([
  ['strawberry', 50],
  ['banana', 100],
  ['ice', 150],
])

for (let item of recipe_juice.keys()) {
  console.log(item);
}  // strawberry banana ice

for (let amount of recipe_juice.values()) {
  console.log(amount);
} // 50 100 150

for (let entity of recipe_juice.entries()) {
  console.log(entity);
} // [ 'strawberry', 50 ] [ 'banana', 100 ] [ 'ice', 150 ]

Map ↔ Object 변환

Object.fromEntries(Map) map → object
Object.entries(Object) object → map

---

💻 Set

• value만을 저장하며, 중복을 허용하지 않는 collection

생성

new Set()

요소 추가/ 삭제

Set.add(value) 요소 추가
Set.has(value) 요소 존재 여부 확인
Set.delete(value) 요소 삭제
Set.clear() 전체 삭제

let set = new Set();
let num = new Set([1, 2, 3, 4]);

set.add(1).add(10).add(20); //Set(3) {1, 10, 20}
set.has(2); //false
set.delete(1); //Set(2) {10, 20}
set.clear();

기타 메소드

Set.size 개수 확인
Set.keys() Set.values() Set.entires()

set 반복문

Collection 객체인 set 이 가지고 있는 iterator속성을 이용하여 for … of 구문을 통해 반복문 수행 가능

let set = new Set();
let num = new Set([1, 2, 3, 4, 5]);
let str = new Set('hello!');

console.log(str); // Set(5) { 'h', 'e', 'l', 'o', '!' }

for (let item of str) {
  console.log(item); // h e l o ! 순으로 value 값이 리턴 된다.
}

for (let item of str.keys()) {
  console.log(item); // h e l o ! 
}                    // -> set은 key가 없기 때문에 동일한 결과 반환

for (let item of str.values()) {
  console.log(item); // h e l o ! 
}                    // -> .values를 추가하지 않은것과 동일한 결과 반환

for (let item of str.entries()) {
  console.log(item); 
  // [ 'h', 'h' ] [ 'e', 'e' ] [ 'l', 'l' ] [ 'o', 'o' ] [ '!', '!' ]
} // key, value 형태로 포맷을 지켜서 반환. key와 value로 같은 요소를 호출