JavaScript기초4 - Map

오늘은 스파르타 코딩 클럽 부트캠프에서 제공된 JavaScript 문법 강의를 들은 후
복습과 실습으로 익숙해져야 할 것 같아 실습한 내용을 정리해보려고 한다.

Map, Set 등장 배경

자바스크립트에서 객체와 배열을 사용하여 많고 다양하고 복잡한 프로그램을 만들어왔다.
하지만 복잡한 현실 세계를 반영하기에는 어려웠다.
그래서 Map, Set과 같은 추가적인 자료구조가 등장했다.

Map, Set 목적

데이터의 구성, 검색, 사용을 효울적으로 처리하기 위함이다.
(기존의 배열 또는 객체보다)

Map이란?

객체와 비슷하게 key - value 값을 저장한다.
키가 정렬된 순서로 저장된다. (즉, 삽입 순서를 기억한다)

Map과 Object의 차이

객체는 key에 무조건 문자만 사용가능하다,
하지만 Map은 key에 어떤 유형(데이터 타입)도 다 들어올 수 있다.
즉, 다양한 자료형을 허용한다.
예를들어 객체를 키로 사용이 가능하다.

Map의 기능

검색, 삭제, 제거, 여부확인 기능을 제공하고 있다.

Map의 주요 메서드와 프로퍼티

let map = new Map(); - 맵을 생성
map.set(key, value) - key를 이용해 value를 저장
map.get(key) - key에 해당하는 값을 반환
map.has(key) - key가 존재하면 true, 존재하지 않으면 false를 반환
map.delete(key) - key에 해당하는 값을 삭제
map.clear() - 맵 안에 모든 요소를 제거
map.size() - 요소의 개수를 반환

자 이제 실습을 통해 익숙해져보자!

• 맵 생성 및 set ( key를 이용하여 value를 저장 )

  let myMap = new Map();
  myMap.set('helloImKey','HelloImValue');

• 맵의 값을 get을 이용하여 반환 ( key를 이용하여 반환 )

  console.log(myMap.get('helloImKey'));

• 맵의 키가 존재하면 ture or false 값을 반환

  console.log(myMap.has('helloImKey'));

• 맵의 특정 키값에 해당하는 값을 삭제

  myMap.delete('helloImKey');

• 맵의 모든 요소를 제거

  myMap.clear();
  console.log(myMap);
  // 삭제 후 콘솔에서 확인되는 결과는 Map(0) {}

• 맵의 사이즈 확인

  console.log(myMap.size);

여기까지 Map의 기본 개념과 주요 메서드와 프로퍼티 실습을 해보았고
다음 블로그에 더 많은 Map의 기능을 실습해 보려고 한다.