[Javascript] 내장 객체 - Map

Bam·2022년 2월 26일
0

Javascript

목록 보기
46/106
post-thumbnail
post-custom-banner

Map 객체

Map 객체연관 배열을 다루는데 도움을 주는 객체입니다. 기존에는 객체 리터럴로 연관 배열을 관리했는데 ES6에서 Map 객체가 등장하면서 연관 배열을 간편하게 생성할 수 있게 되었습니다.

let 변수명 = new Map();

객체 리터럴과 Map 객체의 차이

그러면 Map 객체로 연관 배열을 관리하면 어떤 이점이 있는지 알아보겠습니다.

  • 키가 문자열이 아니어도 된다
    기존의 연관 배열은 키를 문자열로만 설정할 수 있었습니다. 하지만 Map이 등장하면서 키에 문자열뿐만 아니라 숫자 등 임의의 데이터형으로 설정할 수 있게되었습니다.

  • 사이즈 취득가능
    객체 리터럴은 크기를 얻으려면 for~in구문을 사용해서 일일히 요소를 카운트 했어야했는데, Map은 size 프로퍼티를 지원하면서 간단하게 크기를 취득할 수 있게되었습니다.

  • 완전히 비어있는 연관 배열의 생성
    기존의 객체 리터럴 방식은 연관 배열을 만들 때 Object객체가 준비되어있는 프로퍼티가 존재하고 있습니다. 즉, 객체 리터럴로 연관 배열을 생성하면 처음 생성한 상태임에도 불구하고 비어있지 않다는 것 인데 Map을 이용하면 완전히 비어있는 연관 배열을 생성할 수 있습니다.

이렇다고 해서 무조건 Map 객체를 통한 연관 배열 생성, 관리가 좋다는 것은 아닙니다. 각자의 장점이 있기 때문에 필요한 상황에 맞춰서 사용하시면 될 것 같습니다.

size

size

size는 연관 배열의 크기를 취득합니다. 프로퍼티쌍 키:값을 하나로 셉니다.

let map1 = new Map();

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

console.log(map1.size);

set

set(key, value)

set은 연관 배열에 요소를 추가합니다. 만약 key가 중복되게 추가한다면 기존 value값은 새로운 value값으로 덮여씌워집니다.

let map1 = new Map();

console.log(map1);

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

console.log(map1);

get

get(key)

get은 key로 연관 배열을 탐색해 값을 반환합니다.

let map1 = new Map();

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

console.log(map1.get('color'));

has

has(key)

has는 key의 요소가 존재하는지를 판별합니다.

let map1 = new Map();

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

console.log(map1.has('color'));

delete, clear

delete(key)
clear()

delete는 key의 요소를 삭제합니다. clear는 모든 요소를 삭제합니다.

let map1 = new Map();

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

map1.delete('release');
console.log(map1);

map1.clear();
console.log(map1);

entries, keys, values

entries()
keys()
values()

요소를 취득하는 메소드들 입니다.
entries는 모든 키와 키값을 얻고, keys는 모든 키를 얻고, values는 모든 키 값을 얻는 메소드입니다.

let map1 = new Map();

map1.set('name', 'car');
map1.set('color', 'blue');
map1.set('release', 2021);

console.log(map1.keys());
console.log(map1.values());
console.log(map1.entries());

forEach

forEach(func, [that])

연관 배열의 요소들을 차례대로 func에 따라 처리하는 메소드입니다.

post-custom-banner

0개의 댓글