[JavaScript] Map 객체

tacowasabii·2024년 7월 14일

JavaScript

목록 보기
11/15
post-thumbnail

Map 객체는 ES6에서 새로 도입된 데이터 구조이다. 기본적으로 객체와 유사하지만 차이점이 있다. 이 글에서는 Map 객체의 특징과 간단한 사용법에 대해 알아본다

1. Map 객체란?

Map 객체는 키-값 쌍을 저장하며, 각 키는 고유하다. 객체와 달리, Map 객체는 모든 데이터 타입을 키로 사용할 수 있다. 즉, 객체, 함수, 원시 타입(문자열, 숫자 등) 모두 Map의 키가 될 수 있다.

2. Map 객체의 주요 특징

  1. 키의 타입 제한 없음:

    • 객체의 키는 문자열이나 심볼만 가능하지만, Map은 모든 데이터 타입을 키로 사용할 수 있다.
  2. 순서 보장:

    • Map 객체는 삽입된 순서를 기억하므로, 순서가 중요한 데이터를 다룰 때 유용하다.
  3. 크기 속성:

    • Map 객체는 size 속성을 제공하여, 저장된 키-값 쌍의 개수를 쉽게 알 수 있다.

3. Map 객체의 주요 메서드

  • set(key, value): 맵에 키-값 쌍을 추가한다. 이미 존재하는 키라면 값을 업데이트한다.
  • get(key): 키에 해당하는 값을 반환한다. 키가 존재하지 않으면 undefined를 반환한다.
  • has(key): 키가 맵에 존재하는지 여부를 반환한다.
  • delete(key): 키-값 쌍을 삭제한다.
  • clear(): 모든 키-값 쌍을 삭제한다.
  • size: 맵의 크기를 반환한다.

예시 코드

// Map 객체 생성
const map = new Map();

// 키-값 쌍 추가
map.set('name', 'John');
map.set(1, 'one');
map.set(true, 'trueValue');

// 키로 값 가져오기
console.log(map.get('name')); // 'John'
console.log(map.get(1)); // 'one'
console.log(map.get(true)); // 'trueValue'

// 키가 존재하는지 확인
console.log(map.has('name')); // true
console.log(map.has('age')); // false

// 키-값 쌍 삭제
map.delete('name');
console.log(map.has('name')); // false

// Map의 크기
console.log(map.size); // 2

// 모든 키-값 쌍 삭제
map.clear();
console.log(map.size); // 0

4. Map과 Object의 비교

  1. 키의 타입:

    • Object: 문자열과 심볼만 키로 사용 가능.
    • Map: 모든 데이터 타입을 키로 사용 가능.
  2. 순서 보장:

    • Object: 키-값 쌍의 순서 보장이 없음.
    • Map: 키-값 쌍이 삽입된 순서를 기억.
  3. 크기 속성:

    • Object: 크기를 직접 계산해야 함 (Object.keys(obj).length 등).
    • Map: size 속성을 통해 쉽게 크기 확인 가능.
  4. 성능:

    • Map은 삽입, 삭제, 검색 등에서 더 나은 성능을 제공할 수 있음.

5. Map을 사용하는게 좋은 상황

  1. 키의 타입이 다양할 때 (예: 숫자, 객체 등)
  2. 데이터의 삽입 순서가 중요한 경우
  3. 빈번한 삽입, 삭제, 검색 작업이 있는 경우
  4. 명확하게 Map의 기능을 활용할 때 (set, get, has, delete 등)

6. Object를 사용하는게 좋은 상황

  1. 키가 문자열이나 심볼인 경우
  2. 데이터의 크기가 작고, 간단한 키-값 쌍 저장이 필요한 경우
  3. 프로토타입 상속을 활용해야 하는 경우
  4. 표기법으로 접근할 때 코드가 더 직관적일 때

코테 풀때는 웬만하면 Map 쓰는 게 좋은거 같다

profile
LG CNS 클라우드 엔지니어 / 웹 프론트엔드 개발자

0개의 댓글