[JS] Map과 Set

▶ Map과 Set

Map과 Set은 최근 등장한 자료구조이다.

• 데이터의 구성, 검색 및 사용을 객체(object)와 배열(array)보다 효율적으로 처리할 수 있게 한다.
• Map 및 Set은 모두 값 추가, 검색, 삭제 및 모든 값 제거를 수행할 수 있다.

▷ Map

Map이란?

• Map은 키-값 쌍을 저장하는 객체와 비슷하다.
• Map은 각 쌍의 키와 값을 저장하지만, 객체와 달리 키로 사용할 수 있는 모든 데이터 타입을 사용할 수 있다. (객체는 키에 string 형태만 사용 가능)
• Map은 키가 정렬된 순서로 저장되기 때문에, 추가한 순서대로 반복할 필요가 없다.

Map의 기능

• 키-값 쌍 추가 및 검색(set)
• 키-값 쌍 삭제(delete)
• 모든 키-값 쌍 제거(clear)
• Map 크기 및 존재 여부 확인(size)

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	요소의 개수를 반환한다.

Map 생성 및 사용

새로운 Map을 만들려면 Map() 생성자를 사용한다.

const myMap = new Map();

Map에 값을 추가하려면 set() 메소드를 사용한다.

myMap.set("key", "value");

Map에서 값을 검색하려면 get() 메서드를 사용한다.

console.log(myMap.get("key")); // 'value' 출력

Map의 반복⭐

• Map에서는 keys(), values(), entries() 메서드를 사용하여 키, 값 및 키-값 쌍을 반복할 수 있다.

메서드	설명
Object.keys(obj)	객체의 키만 담은 배열을 반환한다.
Object.value(obj)	객체의 값만 담은 배열을 반환한다.
Object.entries(obj)	[키, 값] 쌍을 담은 배열을 반환한다

• 아래 예시 코드에서 myMap.keys()으로 쓸 수 있는 이유는 myMap.key()가 반환하는 값이 《 iterator(반복자) 》이기 때문이다.
• 즉, 컬렉션 객체가 [Symbol.iterator] 속성을 갖고 있기 때문에 for of를 사용할 수 있는 것이다!

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);
}

for (const value of myMap.values()) {
  console.log(value);
}

for (const entry of myMap.entries()) {
  console.log(`${entry[0]}: ${entry[1]}`);
}

Map의 크기 및 존재 여부 확인

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

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

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

console.log(myMap.has("two")); // true 출력

▷ Set

Set이란?

• Map은 키-값 쌍을 저장하는 객체와 비슷하며, Set은 고유한 값을 저장하는 자료 구조이다.
• 값만 저장하고 키를 저장하지는 않는다.
• 값이 중복되지 않는 유일한 요소로만 구성된다.

Set 생성 및 사용

새로운 Map을 만들려면 Set() 생성자를 사용한다.

const mySet = new Set();

Set의 반복⭐

• Map과 마찬가지로 for of를 사용한다.
• 하지만, Set은 value만을 반환한다.

const mySet = new Set();

mySet.add("value1");
mySet.add("value3");
mySet.add("value7");
mySet.add("value5");
mySet.add("value2");

// key가 아닌 value가 들어감
for (const value of mySet.values()) {
  console.log(value);
}

Map에 값을 추가하려면 add() 메소드를 사용한다.

mySet.add("value1");

Map의 크기 및 존재 여부 확인

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

console.log(mySet.size); // 1 출력

아래와 같이 똑같은 값을 추가하면 중복된 값으로 인식해서 추가가 안되는 것을 볼 수 있다. (집합의 성질)

const mySet = new Set();

mySet.add("value1");
mySet.add("value2");
mySet.add("value2");
console.log(mySet.size); // 2 출력

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

console.log(mySet.has("value1")); // true 출력

---

📎참조

• https://ko.javascript.info/keys-values-entries