Today I Learned
[Javascipt] Map과 Set
Seo Ji Won
2024. 8. 13. 19:43
1. Map
Map은 키-값 쌍을 저장하는 컬렉션이다.
- 키로 모든 데이터 타입 사용 가능: 객체에서는 키로 문자열이나 심볼만 사용할 수 있지만, Map에서는 키로 숫자, 객체, 함수 등 다양한 데이터 타입을 사용할 수 있다.
- 순서 보장: Map은 삽입 순서를 기억하고, 순서대로 데이터를 순회할 수 있다.
- Iterable: Map은 기본적으로 for...of나 forEach로 순회할 수 있다.
주요 메서드
- set(key, value): 새로운 키-값 쌍을 추가하거나 기존 값을 업데이트한다.
- get(key): 지정된 키에 대한 값을 반환한다.
- has(key): 지정된 키가 존재하는지 여부를 확인하여 true / false값을 반환한다.
- delete(key): 지정된 키-값 쌍을 삭제한다.
- clear(): 모든 키-값 쌍을 삭제한다.
- size: Map의 요소 개수를 반환한다.
- keys(), values(), entries(): 각각 키, 값, 키-값 쌍을 이터레이터로 반환한다.
예시
const newMap = new Map(array); //array로 새로운 map 생성
newMap.has(value) ? 1 : 0 //newMap이라는 map에 value라는 키값이 있는지 확인하여 true/false로 반환
newMap.get(value) // value라는 키의 값이 있는지 확인하여 true/false로 반환
2. Set
Set은 고유한 값을 저장하는 컬렉션이다. 중복된 값을 허용하지 않는다는 특징이 있다.
- 중복된 값을 저장할 수 없다.
- 순서 보장: Set은 삽입된 순서대로 값을 순회할 수 있다.
- Iterable: Set은 for...of나 forEach를 사용하여 순회할 수 있다.
주요 메서드
- add(value): 값을 추가하는 메서드이다. 값이 이미 존재하면 아무 것도 하지 않는다.
- has(value): 값이 존재하는지 여부를 확인한다.
- delete(value): 특정 값을 삭제한다.
- clear(): 모든 값을 삭제한다.
- size: Set의 요소 개수를 반환한다.
- values(): 모든 값을 이터레이터로 반환한다.
예시
배열을 set으로 만들어 중복을 제거할때 쓸 수 있다.
const array = [1, 1, 2, 3, 4, 5];
const newArray = [...new Set(array)];
// newArray = [1, 2, 3, 4, 5]
Map과 Set의 차이점
Map | Set | |
저장 방식 | 키-값 쌍 (key-value pairs) | 고유한 값만 저장 (unique values) |
키 | 모든 데이터 타입 가능 (문자열, 객체 등) | 키와 값이 동일 (값만 저장) |
중복 여부 | 키가 중복될 수 없으며, 값을 업데이트 가능 | 중복된 값은 저장되지 않음 |
순서 보장 | 삽입 순서 보장 | 삽입 순서 보장 |
사용 예시 | 키와 값을 쌍으로 저장해야 하는 경우 | 고유한 값들을 모으거나 존재 여부를 확인하는 경우 |
주요 메서드 | set(), get(), has(), delete(), clear() | add(), has(), delete(), clear() |
언제 Map을 사용하고, 언제 Set을 사용할까?
Map을 사용해야 하는 경우
- 데이터가 키-값 쌍으로 연결된 경우
- 키로 문자열 외 다른 데이터 타입을 사용해야 하는 경우
- 삽입 순서를 유지하고 순회해야 하는 경우
Set을 사용해야 하는 경우
- 값이 고유해야 할 때 (예: 중복을 제거해야 하는 경우)
- 값의 존재 여부를 빠르게 확인해야 하는 경우
- 삽입 순서를 유지해야 하는 경우