본문 바로가기

Javascript

[Javascript] map에 대하여

  • map은 자바스크립트가 가지고 있는 자료구조 중의 하나이다. 
  • map은 object와는 다르게, key의 타입을 다양하게 할 수 있다. object는 string만을 key의 타입으로 가진다. 

 

map을 이용하는  가장 쉬운 방법은 empty로 선언하는 것이다. 

const 맛집 = new Map();

 

 

그러고나서 set을 이용해서 저장하는 방식을 선택하면 된다.  - map.set()

맛집.set('name', '아비꼬');
맛집.set(1, '노원점');
맛집.set(2, '서초점'));

console.log(맛집);

//Map(3) {"name" => "아비꼬", 1 => "노원점", 2 => "서초점"}

 

 

한번에 여러개를 저장하는 것도 가능하다. 

맛집
  .set('메뉴판', ['카레라이스', '카레우동', '크림카레파스타', '하야시라이스'])
  .set('open', 11)
  .set('close', 23)
  .set(true, '문 열었어요 :D')
  .set(false, '문 닫았어요 :c);

 

 

map에서 값을 얻어내기 위해서는 get을 이용하면 된다. - map.get()

console.log(맛집.get('name'));

//아비꼬

 

 

map에서 boolean을  활용하면 이런식으로도 이용가능하다. 

const 현재시간 = 21;
console.log(맛집.get(현재시간 > 맛집.get('open') && 현재시간 < 맛집.get('close')));

//문 열었어요 :D

short-circuiting의 AND를 이용한 예인데,

get()안에 true인지 false인지 확인하는 구문을 넣은 것이다. open시간인 11시보다 현재시간보다 크니 true이다. 

그리고 true라는 key는 '문 열었어요:D'라는 value를 가지고 있기에 '문 열었어요:D'를 출력한다. 

 

 

 

has메서드를 활용해서 해당 key를 가지고 있는지 확인할 수 있다. - map.has()

console.log(맛집.has('메뉴판'));

//true

 

 

맵 안에 있는 요소를 지울수도 있고(map.delete()), 맵의 요소의 갯수(map.size), 맵 안의 요소를 전부 지울 수도 있다.(map.clear)

맛집.delete(2);
console.log(맛집.size);
console.log(맛집.clear);

 

 

 

이렇다면 이 맵은 어떨 때 사용하면 좋은 것일까? 이것이 궁금한 분들은 이 링크를 통해서 확인하면 좋을 것 같다. 

[Javascript]4가지 데이터 저장방식(array,set,object,map) 의 사용기준