JavaScript Map Methods
JavaScript Map Methods: Map 객체의 주요 메서드 정리와 활용
JavaScript의 Map 객체는 키-값 쌍을 저장하고 관리하는 데이터 구조입니다. 객체와 유사하게 동작하지만, Map은 모든
데이터 유형을 키로 사용할 수 있고, 삽입 순서를 유지합니다. Map은 키-값 쌍을 추가, 삭제, 조회하는 다양한 메서드를
제공합니다.
이 가이드는 JavaScript에서 Map 객체의 주요 메서드와 그 활용 방법을 설명합니다.
1. set(): 키-값 쌍 추가 또는 수정
set() 메서드는 Map 객체에 새로운 키-값 쌍을 추가하거나, 이미 존재하는 키에 해당하는 값을
수정합니다.
1.1. 기본 사용법
const map = new Map();
map.set("name", "Alice"); // 키 'name'에 값 'Alice' 추가
map.set("age", 25); // 키 'age'에 값 25 추가
console.log(map); // 출력: Map(2) { 'name' => 'Alice', 'age' => 25 }
// 키가 존재할 경우 값을 수정
map.set("age", 26);
console.log(map); // 출력: Map(2) { 'name' => 'Alice', 'age' => 26 }
- 특징: 키가 존재하면 값을 덮어쓰고, 존재하지 않으면 새로운 키-값 쌍을 추가합니다.
2. get(): 값 조회
get() 메서드는 Map 객체에서 특정 키에 해당하는 값을 반환합니다. 키가 존재하지 않으면
**undefined**를 반환합니다.
2.1. 기본 사용법
console.log(map.get("name")); // 출력: Alice
console.log(map.get("age")); // 출력: 26
console.log(map.get("city")); // 출력: undefined (존재하지 않는 키)
- 특징: 키가 존재하지 않으면
undefined가 반환되므로, 값을 조회할 때는 이 점을 고려해야 합니다.
3. has(): 키 존재 여부 확인
has() 메서드는 Map 객체에 특정 키가 존재하는지 여부를 확인하고, 그 결과를
불리언 값으로 반환합니다.
3.1. 기본 사용법
console.log(map.has("name")); // 출력: true
console.log(map.has("city")); // 출력: false
- 특징:
Map에서 특정 키의 존재 여부를 빠르게 확인할 수 있습니다.
4. delete(): 키-값 쌍 삭제
delete() 메서드는 Map에서 특정 키에 해당하는 키-값 쌍을 삭제합니다. 삭제에 성공하면
**true**를, 실패하면 **false**를 반환합니다.
4.1. 기본 사용법
map.delete("age"); // 키 'age'를 삭제
console.log(map); // 출력: Map(1) { 'name' => 'Alice' }
console.log(map.delete("city")); // 출력: false (키 'city'는 없음)
- 특징: 키가 존재하면 해당 키-값 쌍을 삭제하고
true를 반환합니다.
5. clear(): 모든 키-값 쌍 삭제
clear() 메서드는 Map 객체에서 모든 키-값 쌍을 삭제하여 빈 Map으로
만듭니다.
5.1. 기본 사용법
map.clear();
console.log(map); // 출력: Map(0) {}
- 특징: 모든 데이터를 삭제하고, 빈
Map으로 초기화할 때 유용합니다.
6. size: Map의 크기 확인
size 속성은 Map 객체에 저장된 키-값 쌍의 개수를 반환합니다.
6.1. 기본 사용법
const map = new Map([
["name", "Alice"],
["age", 25]
]);
console.log(map.size); // 출력: 2
- 특징: 배열의
length처럼Map객체의 크기를 쉽게 확인할 수 있습니다.
7. forEach(): 모든 키-값 쌍에 대해 작업 실행
forEach() 메서드는 Map 객체의 각 키-값 쌍에 대해 지정된 콜백
함수를 실행합니다. 배열의 forEach()와 유사하게 동작합니다.
7.1. 기본 사용법
map.forEach((value, key) => {
console.log(`${key}: ${value}`);
});
// 출력:
// name: Alice
// age: 25
- 특징:
Map객체의 모든 요소에 대해 반복 작업을 수행할 때 유용합니다.
8. keys(), values(), entries(): 이터러블 반환
Map 객체는 이터러블 객체로, keys(),
values(), entries() 메서드를 통해 각각 키,
값, 또는 [키, 값] 쌍의 이터레이터를 반환할 수 있습니다.
8.1. keys(): 키 반환
const keys = map.keys();
for (const key of keys) {
console.log(key);
}
// 출력:
// name
// age
8.2. values(): 값 반환
const values = map.values();
for (const value of values) {
console.log(value);
}
// 출력:
// Alice
// 25
8.3. entries(): [키, 값] 쌍 반환
entries()는 Map의 각 요소를 [키, 값] 쌍으로 반환합니다.
const entries = map.entries();
for (const entry of entries) {
console.log(entry);
}
// 출력:
// [ 'name', 'Alice' ]
// [ 'age', 25 ]
9. Map과 배열 변환
Map과 배열 간의 상호 변환은 매우 간단합니다. 배열을 Map으로 변환하거나, Map을 배열로
변환할 수 있습니다.
9.1. 배열을 Map으로 변환
배열을 Map으로 변환할 때는 [키, 값] 쌍으로 이루어진 배열이어야 합니다.
const array = [
["name", "Alice"],
["age", 25]
];
const map = new Map(array);
console.log(map); // 출력: Map(2) { 'name' => 'Alice', 'age' => 25 }
9.2. Map을 배열로 변환
Map 객체를 배열로 변환하려면 전개 연산자나 **Array.from()**을 사용할 수 있습니다.
const map = new Map([
["name", "Alice"],
["age", 25]
]);
// 전개 연산자로 배열 변환
const array = [...map];
console.log(array); // 출력: [ ['name', 'Alice'], ['age', 25] ]
// Array.from()으로 배열 변환
const array2 = Array.from(map);
console.log(array2); // 출력: [ ['name', 'Alice'], ['age', 25] ]
10. Map의 활용 예시
10.1. 키로 객체 사용
Map은 객체를 키로 사용할 수 있는 특징을 가지고 있습니다.
const obj1 = { name: "Alice" };
const obj2 = { name: "Bob" };
const userMap = new Map();
userMap.set(obj1, 100);
userMap.set(obj2, 200);
console.log(userMap.get(obj1)); // 출력: 100
console.log(userMap.get(obj2)); // 출력: 200
10.2. 빈도수 계산
Map을 사용해 배열의 값에 대한 빈도수를 계산할 수 있습니다.
const numbers = [1, 2, 2, 3, 3, 3, 4];
const frequencyMap = new Map();
for (const number of numbers) {
frequencyMap.set(number, (frequencyMap.get(number) || 0) + 1);
}
console.log(frequencyMap);
// 출력: Map(4) { 1 => 1, 2 => 2, 3 => 3, 4 => 1 }
요약
Map객체는 키-값 쌍을 저장하는 구조로, 모든 데이터 유형을 키로 사용할 수 있습니다.- 주요 메서드:
set(): 키-값 추가 또는 수정get(): 값 조회has(): 키 존재 여부 확인delete(),clear(): 키-값 삭제size:Map의 크기 확인forEach(),keys(),values(),entries(): 이터러블을 반환하거나 반복 작업을 수행
- 배열과 상호 변환:
Map은 배열과 상호 변환할 수 있어 데이터 처리에 유연하게 사용됩니다.
JavaScript의 Map 객체는 다양한 데이터 유형을 키로 사용하는 작업에서 강력한 도구로, 다양한 메서드를 통해 데이터를 쉽게 추가, 삭제, 조회하고
관리할 수 있습니다.