This page was translated from English by the community. Learn more and join the MDN Web Docs community.

View in English Always switch to English

Map

Baseline Widely available *

This feature is well established and works across many devices and browser versions. Itโ€™s been available across browsers since โจ2015๋…„ 7์›”โฉ.

* Some parts of this feature may have varying levels of support.

Map ๊ฐ์ฒด๋Š” ํ‚ค-๊ฐ’ ์Œ๊ณผ ํ‚ค์˜ ์›๋ž˜ ์‚ฝ์ž… ์ˆœ์„œ๋ฅผ ๊ธฐ์–ตํ•ฉ๋‹ˆ๋‹ค. ๋ชจ๋“  ๊ฐ’(๊ฐ์ฒด ๋ฐ ์›์‹œ ๊ฐ’ ๋ชจ๋‘)์€ ํ‚ค ๋˜๋Š” ๊ฐ’์œผ๋กœ ์‚ฌ์šฉ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์‹œ๋„ํ•ด ๋ณด๊ธฐ

const map1 = new Map();

map1.set("a", 1);
map1.set("b", 2);
map1.set("c", 3);

console.log(map1.get("a"));
// Expected output: 1

map1.set("a", 97);

console.log(map1.get("a"));
// Expected output: 97

console.log(map1.size);
// Expected output: 3

map1.delete("b");

console.log(map1.size);
// Expected output: 2

์„ค๋ช…

Map ๊ฐ์ฒด๋Š” ํ‚ค-๊ฐ’ ์Œ์ธ ์ง‘ํ•ฉ์ž…๋‹ˆ๋‹ค. ํ•œ Map์—์„œ์˜ ํ‚ค๋Š” ์˜ค์ง ๋‹จ ํ•˜๋‚˜๋งŒ ์กด์žฌ ํ•ฉ๋‹ˆ๋‹ค. ์ด๋Š” Map ์ง‘ํ•ฉ์˜ ์œ ์ผ์„ฑ์ž…๋‹ˆ๋‹ค. Map ๊ฐ์ฒด๋Š” ํ‚ค-๊ฐ’ ์Œ์œผ๋กœ ๋ฐ˜๋ณต๋ฉ๋‹ˆ๋‹ค. for...of ๋ฃจํ”„๋Š” ๊ฐ ๋ฐ˜๋ณต์— ๋Œ€ํ•ด [key, value]๋กœ ์ด๋ฃจ์–ด์ง„ ๋ฉค๋ฒ„๊ฐ€ 2๊ฐœ์ธ ๋ฐฐ์—ด์„ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค. ๋ฐ˜๋ณต์€ ์‚ฝ์ž…ํ•œ ์ˆœ์„œ๋Œ€๋กœ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ์ฆ‰, set() ๋ฉ”์„œ๋“œ๋กœ ๋งต์— ์ฒ˜์Œ ์‚ฝ์ž…ํ•œ ๊ฐ๊ฐ์˜ ํ‚ค-๊ฐ’ ์Œ ์ˆœ์„œ์™€ ๋Œ€์‘๋ฉ๋‹ˆ๋‹ค. (set()์ด ํ˜ธ์ถœ๋˜์—ˆ์„๋•Œ ๋งต์—์„œ ํ•ด๋‹น ํ‚ค๊ฐ€ ์—†์—ˆ์„ ๊ฒฝ์šฐ์ž…๋‹ˆ๋‹ค)

Map์˜ ๋ช…์„ธ๋Š” "ํ‰๊ท ์ ์œผ๋กœ ์ง‘ํ•ฉ ๋‚ด ์š”์†Œ์˜ ์ˆ˜์— ๋”ฐ๋ผ ํ•˜์œ„ ์„ ํ˜•์ธ ์ ‘๊ทผ ์‹œ๊ฐ„์„ ์ œ๊ณตํ•˜๋Š”" ๋งต์„ ๊ตฌํ˜„ํ•ด์•ผ ํ•œ๋‹ค๊ณ  ๊ธฐ์ˆ ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ ๋ณต์žก์„ฑ์ด O(N)๋ณด๋‹ค ๋” ๋‚˜์€ ๊ฒฝ์šฐ ๋‚ด๋ถ€์ ์œผ๋กœ ํ•ด์‹œ ํ…Œ์ด๋ธ”(O(1) ๋ฃฉ์—…), ๊ฒ€์ƒ‰ ํŠธ๋ฆฌ(O(log(N)) ๋ฃฉ์—…) ๋˜๋Š” ๊ธฐํƒ€ ๋ฐ์ดํ„ฐ ๊ตฌ์กฐ๋กœ ํ‘œํ˜„๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ‚ค ๋™์ผ์„ฑ

๊ฐ’ ๋™์ผ์„ฑ์€ SameValueZero์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•ฉ๋‹ˆ๋‹ค.(0๊ณผ -0์„ ๋‹ค๋ฅด๊ฒŒ ์ทจ๊ธ‰ํ•˜๋Š” ๋“ฑ๊ฐ€ ๊ฐ™์Œ์„ ์‚ฌ์šฉํ•˜์˜€์Šต๋‹ˆ๋‹ค. ๋ธŒ๋ผ์šฐ์ € ํ˜ธํ™˜์„ฑ์„ ํ™•์ธํ•ด๋ณด์„ธ์š”). ์ฆ‰, NaN !== NaN์—๋„ ๋ถˆ๊ตฌํ•˜๊ณ  NaN์€ NaN๊ณผ ๋™์ผํ•˜๊ฒŒ ๊ฐ„์ฃผ๋˜๋ฉฐ, ๋‹ค๋ฅธ ๋ชจ๋“  ๊ฐ’์€ === ์—ฐ์‚ฐ์ž์˜ ์˜๋ฏธ๋ก ์— ๋”ฐ๋ผ ๋™์ผํ•˜๊ฒŒ ๊ฐ„์ฃผ๋ฉ๋‹ˆ๋‹ค.

๊ฐ์ฒด vs ๋งต

Object๋Š” Map๊ณผ ์œ ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ๋‘˜ ๋‹ค ๊ฐ’์„ ๊ฐ€๋ฆฌํ‚ค๋Š” ํ‚ค๋ฅผ ์„ค์ •ํ•˜๊ณ , ํ•ด๋‹น ๊ฐ’์„ ๋ฐ›์•„์˜ค๋ฉฐ, ํ‚ค๋ฅผ ์‚ญ์ œํ•˜๋ฉฐ, ํ‚ค์— ๋ฌด์–ธ๊ฐ€๊ฐ€ ์ €์žฅ๋˜์—ˆ๋Š”์ง€ ์—ฌ๋ถ€๋ฅผ ์•Œ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ์ด์œ ๋กœ (๊ทธ๋ฆฌ๊ณ  ๋Œ€์•ˆ์œผ๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋‚ด์žฅ ๊ฐ์ฒด๊ฐ€ ์—†์—ˆ๊ธฐ ๋•Œ๋ฌธ์—) Object๋Š” ์—ญ์‚ฌ์ ์œผ๋กœ Map์œผ๋กœ ์‚ฌ์šฉ๋˜์–ด ์™”์Šต๋‹ˆ๋‹ค.

๊ทธ๋Ÿฌ๋‚˜ ๊ฒฝ์šฐ์— ๋”ฐ๋ผ์„œ๋Š” ์•„๋ž˜์™€ ๊ฐ™์ด Map์ด ์„ ํ˜ธ๋˜๋Š” ์ค‘์š”ํ•œ ์ฐจ์ด์ ์ด ์žˆ์Šต๋‹ˆ๋‹ค.

Map Object
์šฐ๋ฐœ์  ํ‚ค Map๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ํ‚ค๋ฅผ ํฌํ•จํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์—๋Š” ๋ช…์‹œ์ ์œผ๋กœ ์ž…๋ ฅ๋œ ๋‚ด์šฉ๋งŒ ํฌํ•จ๋ฉ๋‹ˆ๋‹ค.

Object๋Š” ํ”„๋กœํ† ํƒ€์ž…์ด ์žˆ์œผ๋ฏ€๋กœ ์ฃผ์˜ํ•˜์ง€ ์•Š์œผ๋ฉด ์ž์‹ ์˜ ํ‚ค์™€ ์ถฉ๋Œํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋ณธ ํ‚ค๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

์ฐธ๊ณ : ์ด๋Š” Object.create(null)๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๋ฌด์‹œํ•  ์ˆ˜ ์žˆ์ง€๋งŒ ๊ฑฐ์˜ ์ˆ˜ํ–‰๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

๋ณด์•ˆ Map์€ ์‚ฌ์šฉ์ž๊ฐ€ ์ œ๊ณตํ•˜๋Š” ํ‚ค์™€ ๊ฐ’์— ๋Œ€ํ•ด์„œ ์•ˆ์ „ํ•˜๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์‚ฌ์šฉ์ž๊ฐ€ ์ œ๊ณตํ•œ ํ‚ค-๊ฐ’ ์Œ์„ Object์— ์„ค์ •ํ•˜๋ฉด ๊ณต๊ฒฉ์ž๊ฐ€ ๊ฐ์ฒด์˜ ํ”„๋กœํ† ํƒ€์ž…์„ ์žฌ์ •์˜ํ•˜์—ฌ ๊ฐ์ฒด ์ฃผ์ž… ๊ณต๊ฒฉ์„ ๋ฐœ์ƒ์‹œํ‚ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋Œ๋ฐœ์ ์ธ ํ‚ค ๋ฌธ์ œ์™€ ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ null ํ”„๋กœํ† ํƒ€์ž… ๊ฐ์ฒด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ‚ค ์œ ํ˜• Map์˜ ํ‚ค๋Š” ๋ชจ๋“  ๊ฐ’(ํ•จ์ˆ˜, ๊ฐ์ฒด ๋˜๋Š” ์›์‹œ๊ฐ’ ํฌํ•จ)์ด ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Object์˜ ํ‚ค๋Š” String ๋˜๋Š” Symbol์ด์—ฌ์•ผ ํ•ฉ๋‹ˆ๋‹ค.
ํ‚ค ์ˆœ์„œ

Map์—์„œ ํ‚ค๋Š” ๋‹จ์ˆœํ•˜๊ณ  ์ง๊ด€์ ์ธ ๋ฐฉ์‹์œผ๋กœ ์ •๋ ฌ๋ฉ๋‹ˆ๋‹ค. Map ๊ฐ์ฒด๋Š” ํ•ญ๋ชฉ์„ ์‚ฝ์ž…ํ•œ ์ˆœ์„œ๋Œ€๋กœ ํ•ญ๋ชฉ, ํ‚ค ๋ฐ ๊ฐ’์„ ๋ฐ˜๋ณตํ•ฉ๋‹ˆ๋‹ค.

์ผ๋ฐ˜์ ์ธ Object์˜ ํ‚ค๋Š” ์ •๋ ฌ๋˜์–ด ์žˆ์ง€๋งŒ ํ•ญ์ƒ ๊ทธ๋Ÿฐ๊ฒƒ์€ ์•„๋‹ˆ๋ฉฐ ์ˆœ์„œ๊ฐ€ ๋ณต์žกํ•ฉ๋‹ˆ๋‹ค. ๊ฒฐ๊ณผ์ ์œผ๋กœ ์†์„ฑ ์ˆœ์„œ์— ์˜์กดํ•˜์ง€ ์•Š๋Š” ๊ฒƒ์ด ๊ฐ€์žฅ ์ข‹์Šต๋‹ˆ๋‹ค.

์ˆœ์„œ๋Š” ECMAScript 2015์—์„œ๋งŒ ์ž์ฒด ์†์„ฑ์— ๋Œ€ํ•ด ์ฒ˜์Œ ์ •์˜๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ECMAScript 2020์€ ์ƒ์†๋œ ์†์„ฑ์˜ ์ˆœ์„œ๋„ ์ •์˜ํ•ฉ๋‹ˆ๋‹ค. OrdinaryOwnPropertyKeys ์™€ EnumerateObjectProperties ์ถ”์ƒ ๋ช…์„ธ์ž‘์—…์„ ์ฐธ๊ณ ํ•˜์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ๊ฐ์ฒด์˜ ๋ชจ๋“  ์†์„ฑ์„ ๋ฐ˜๋ณตํ•˜๋Š” ๋‹จ์ผ ๋ฉ”์ปค๋‹ˆ์ฆ˜์€ ์—†์Šต๋‹ˆ๋‹ค. ๋‹ค์–‘ํ•œ ๋ฉ”์ปค๋‹ˆ์ฆ˜์—๋Š” ๊ฐ๊ฐ ๋‹ค๋ฅธ ์†์„ฑ ํ•˜์œ„ ์ง‘ํ•ฉ์ด ํฌํ•จ๋ฉ๋‹ˆ๋‹ค (for-in์€ ์˜ค์ง ์—ด๊ฑฐ ๊ฐ€๋Šฅํ•œ ๋ฌธ์ž์—ด ํ‚ค ์†์„ฑ๋งŒ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. Object.keys์€ ์—ด๊ฑฐ ๊ฐ€๋Šฅํ•œ ์ž์ฒด ๋ฌธ์ž์—ด ํ‚ค ์†์„ฑ๋งŒ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. Object.getOwnPropertyNames์€ ์—ด๊ฑฐ ๋ถˆ๊ฐ€๋Šฅํ•˜๋”๋ผ๋„ ์ž์ฒด ๋ฌธ์ž์—ด ํ‚ค ์†์„ฑ์„ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. Object.getOwnPropertySymbols์€ Symbol-ํ‚ค ์†์„ฑ์— ๋Œ€ํ•ด ๋™์ผํ•ฉ๋‹ˆ๋‹ค.)

ํฌ๊ธฐ

Map์˜ ์•„์ดํ…œ์˜ ์ˆ˜๋Š” size ์†์„ฑ์—์„œ ์‰ฝ๊ฒŒ ๊ฐ€์ ธ์˜ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Object์˜ ์•„์ดํ…œ ์ˆ˜๋Š” ์ˆ˜๋™์œผ๋กœ ๊ฒฐ์ •ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.
์ˆœํšŒ Map์€ ์ˆœํšŒ๊ฐ€๋Šฅ(iterable)ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ด๋ฏ€๋กœ ์ง์ ‘ ๋ฐ˜๋ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Object๋Š” iteration protocol์„ ๊ตฌํ˜„ํ•˜์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์— ๋กœ ๊ฐœ์ฒด๋Š” for...of๋ฌธ์„ ์‚ฌ์šฉํ•˜์—ฌ ์ง์ ‘์ ์œผ๋กœ ๋ฐ˜๋ณตํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

์ฐธ๊ณ :

  • ๊ฐ์ฒด๋Š” iteration protocol์„ ๊ตฌํ˜„ํ•˜๊ฑฐ๋‚˜ Object.keys ํ˜น์€ Object.entries ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ฐ์ฒด์˜ ๋ฐ˜๋ณต ๊ฐ€๋Šฅ ํ•ญ๋ชฉ์„ ์–ป์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  • for...in ๋ฌธ์„ ์‚ฌ์šฉํ•˜๋ฉด ๊ฐ์ฒด์˜ ์—ด๊ฑฐ ๊ฐ€๋Šฅํ•œ ์†์„ฑ(enumerable)์„ ๋ฐ˜๋ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค .
์„ฑ๋Šฅ

ํ‚ค-๊ฐ’ ์Œ์˜ ๋นˆ๋ฒˆํ•œ ์ถ”๊ฐ€ ๋ฐ ์ œ๊ฑฐ์™€ ๊ด€๋ จ๋œ ์ƒํ™ฉ์—์„œ๋Š” ์„ฑ๋Šฅ์ด ์ข€ ๋” ์ข‹์Šต๋‹ˆ๋‹ค.

ํ‚ค-๊ฐ’ ์Œ์˜ ๋นˆ๋ฒˆํ•œ ์ถ”๊ฐ€ ๋ฐ ์ œ๊ฑฐ์— ์ตœ์ ํ™”๋˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค.

Serialization and parsing

์ง๋ ฌํ™” ๋˜๋Š” ๊ตฌ๋ฌธ ๋ถ„์„์— ๋Œ€ํ•œ ๊ธฐ๋ณธ ์ง€์›์ด ์—†์Šต๋‹ˆ๋‹ค.

(ํ•˜์ง€๋งŒ JSON.stringify()์— ์ธ์ž๋กœ replacer๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค๋ฉด Map์— ๋Œ€ํ•œ ์ž์‹ ๋งŒ์˜ ์ง๋ ฌํ™” ๋ฐ ๊ตฌ๋ฌธ ๋ถ„์„์„ ์ง€์›ํ•˜๊ฒŒ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Stack Overflow ์งˆ๋ฌธ์ธ How do you JSON.stringify an ES6 Map?)์„ ์ฐธ๊ณ ํ•˜์„ธ์š”.)

JSON.stringify()๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ Object์„ JSON์œผ๋กœ ์ง๋ ฌํ™”๋ฅผ ๊ธฐ๋ณธ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.

JSON.parse()๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ JSON์—์„œ Object์œผ๋กœ์˜ ๊ตฌ๋ฌธ ๋ถ„์„์„ ๊ธฐ๋ณธ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.

๊ฐ์ฒด ์†์„ฑ ์„ค์ •ํ•˜๊ธฐ

๊ฐ์ฒด ์†์„ฑ ์„ค์ •์€ Map ๊ฐ์ฒด์—์„œ๋„ ์ž‘๋™ํ•˜์ง€๋งŒ ์ƒ๋‹นํ•œ ํ˜ผ๋ž€์„ ์•ผ๊ธฐํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋”ฐ๋ผ์„œ ์ด๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๋ฐฉ์‹์œผ๋กœ ๋™์ž‘ํ•˜๋Š” ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ž…๋‹ˆ๋‹ค.

js
const wrongMap = new Map();
wrongMap["bla"] = "blaa";
wrongMap["bla2"] = "blaaa2";

console.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }

๊ทธ๋Ÿฌ๋‚˜ ์†์„ฑ์„ ์„ค์ •ํ•˜๋Š” ๋ฐฉ๋ฒ•์€ Map ๋ฐ์ดํ„ฐ ๊ตฌ์กฐ์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์†์„ฑ ์„ค์ •์€ ์ผ๋ฐ˜ ๊ฐ์ฒด์˜ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. 'bla' ๊ฐ’์€ ์งˆ์˜๋ฅผ ์œ„ํ•œ Map์— ์ €์žฅ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋ฐ์ดํ„ฐ์— ๋Œ€ํ•œ ๋‹ค๋ฅธ ์ž‘์—…๋„ ์•„๋ž˜์™€ ๊ฐ™์ด ์‹คํŒจํ•ฉ๋‹ˆ๋‹ค.

js
wrongMap.has("bla"); // false
wrongMap.delete("bla"); // false
console.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }

๋งต์— ๋ฐ์ดํ„ฐ๋ฅผ ์ €์žฅํ•˜๋Š” ์˜ฌ๋ฐ”๋ฅธ ๋ฐฉ๋ฒ•์€ set(key, value) ๋ฉ”์„œ๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค.

js
const contacts = new Map();
contacts.set("Jessie", { phone: "213-555-1234", address: "123 N 1st Ave" });
contacts.has("Jessie"); // true
contacts.get("Hilary"); // undefined
contacts.set("Hilary", { phone: "617-555-4321", address: "321 S 2nd St" });
contacts.get("Jessie"); // {phone: "213-555-1234", address: "123 N 1st Ave"}
contacts.delete("Raymond"); // false
contacts.delete("Jessie"); // true
console.log(contacts.size); // 1

์ƒ์„ฑ์ž

Map()

์ƒˆ๋กœ์šด Map ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•ฉ๋‹ˆ๋‹ค.

์ •์  ์†์„ฑ

get Map[@@species]

ํŒŒ์ƒ ๊ฐ์ฒด๋ฅผ ๋งŒ๋“œ๋Š” ๋ฐ ์‚ฌ์šฉ๋˜๋Š” ์ƒ์„ฑ์ž ํ•จ์ˆ˜์ž…๋‹ˆ๋‹ค.

์ธ์Šคํ„ด์Šค ์†์„ฑ

Map.prototype[@@toStringTag]

@@toStringTag ์†์„ฑ์˜ ์ดˆ๊ธฐ ๊ฐ’์€ ๋ฌธ์ž์—ด "Map"์ž…๋‹ˆ๋‹ค. ์ด ์†์„ฑ์€ Object.prototype.toString()์—์„œ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.size

Map ๊ฐ์ฒด์˜ ํ‚ค/๊ฐ’ ์Œ์˜ ์ˆซ์ž๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

์ธ์Šคํ„ด์Šค ๋ฉ”์„œ๋“œ

Map.prototype.clear()

Map ๊ฐ์ฒด์—์„œ ๋ชจ๋“  ํ‚ค-๊ฐ’ ์Œ์„ ์ œ๊ฑฐํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.delete()

Map ๊ฐ์ฒด์— ํ•ด๋‹น ์š”์†Œ๊ฐ€ ์กด์žฌํ•˜๋ฉฐ ์‚ญ์ œ๋˜์—ˆ์„ ๊ฒฝ์šฐ true๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋ฉฐ ํ•ด๋‹น ์š”์†Œ๊ฐ€ ์กด์žฌํ•˜์ง€ ์•Š๋Š” ๊ฒฝ์šฐ false๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค. ์ด ์ดํ›„์— map.has(key)๋ฅผ ์‹คํ–‰ํ•˜๋ฉด false๋ฅผ ๋ฐ˜ํ™˜ํ•  ๊ฒƒ์ž…๋‹ˆ๋‹ค.

Map.prototype.get()

์ฃผ์–ด์ง„ ํ‚ค์— ํ•ด๋‹นํ•˜๋Š” ๊ฐ’์„ ๋ฐ˜ํ™˜ํ•˜๊ฑฐ๋‚˜ ๊ฐ’์ด ์—†๋‹ค๋ฉด undefined์„ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.has()

์ฃผ์–ด์ง„ ํ‚ค์— ์—ฐ๊ด€๋œ ๊ฐ’์ด Map ๊ฐ์ฒด์— ์กด์žฌํ•˜๋Š”์ง€ ์—ฌ๋ถ€๋ฅผ ๋ถˆ๋ฆฌ์–ธ ๊ฐ’์œผ๋กœ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.set()

Map๊ฐ์ฒด์—์„œ ์ „๋‹ฌ๋œ ํ‚ค์˜ ๊ฐ’์„ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค. Map๊ฐ์ฒด๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype[@@iterator]()

Map ๊ฐ์ฒด์— ์‚ฝ์ž…๋œ ์ˆœ์„œ์— ๋”ฐ๋ผ [key, value] ๋‘ ๊ฐœ์˜ ๋ฉค๋ฒ„ ๋ฐฐ์—ด์„ ํฌํ•จํ•˜๋Š” ์ƒˆ๋กœ์šด ๋ฐ˜๋ณต์ž๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.keys()

Map ๊ฐ์ฒด์— ์‚ฝ์ž…๋œ ์ˆœ์„œ์— ๋”ฐ๋ผ ๊ฐ ์š”์†Œ์˜ ํ‚ค๋ฅผ ํฌํ•จํ•˜๋Š” ์ƒˆ๋กœ์šด ๋ฐ˜๋ณต์ž๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.values()

Map ๊ฐ์ฒด์— ์‚ฝ์ž…๋œ ์ˆœ์„œ์— ๋”ฐ๋ผ ๊ฐ ์š”์†Œ์˜ ๊ฐ’์„ ํฌํ•จํ•˜๋Š” ์ƒˆ๋กœ์šด ๋ฐ˜๋ณต์ž๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.entries()

Map ๊ฐ์ฒด์— ์‚ฝ์ž…๋œ ์ˆœ์„œ์— ๋”ฐ๋ผ [key, value] ๋‘ ๊ฐœ์˜ ๋ฉค๋ฒ„ ๋ฐฐ์—ด์„ ํฌํ•จํ•˜๋Š” ์ƒˆ๋กœ์šด ๋ฐ˜๋ณต์ž๋ฅผ ๋ฐ˜ํ™˜ํ•ฉ๋‹ˆ๋‹ค.

Map.prototype.forEach()

Map๊ฐ์ฒด์— ์กด์žฌํ•˜๋Š” ๊ฐ ํ‚ค-๊ฐ’ ์Œ์— ๋Œ€ํ•ด ์‚ฝ์ž… ์ˆœ์„œ๋Œ€๋กœ callbackFn์„ ํ•œ ๋ฒˆ์”ฉ ํ˜ธ์ถœ ํ•ฉ๋‹ˆ๋‹ค. ๋งŒ์•ฝ forEachํ˜ธ์ถœ ์‹œ thisArg ๋งค๊ฐœ๋ณ€์ˆ˜๊ฐ€ ์žˆ๋‹ค๋ฉด ๊ฐ ์ฝœ๋ฐฑ์˜ this ๊ฐ’์œผ๋กœ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.

์˜ˆ์ œ

Map ๊ฐ์ฒด ์‚ฌ์šฉํ•˜๊ธฐ

js
const myMap = new Map();

const keyString = "a string";
const keyObj = {};
const keyFunc = function () {};

// ๊ฐ’ ์„ค์ •
myMap.set(keyString, "value associated with 'a string'");
myMap.set(keyObj, "value associated with keyObj");
myMap.set(keyFunc, "value associated with keyFunc");

console.log(myMap.size); // 3

// ๊ฐ’ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ
console.log(myMap.get(keyString)); // "value associated with 'a string'"
console.log(myMap.get(keyObj)); // "value associated with keyObj"
console.log(myMap.get(keyFunc)); // "value associated with keyFunc"

console.log(myMap.get("a string")); // "value associated with 'a string'", ์™œ๋ƒํ•˜๋ฉด keyString === 'a string'
console.log(myMap.get({})); // undefined, ์™œ๋ƒํ•˜๋ฉด keyObj !== {}
console.log(myMap.get(function () {})); // undefined, ์™œ๋ƒํ•˜๋ฉด keyFunc !== function () {}

Map ํ‚ค๋กœ NaN ์‚ฌ์šฉํ•˜๊ธฐ

NaN๋„ ํ‚ค๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ชจ๋“  NaN์ด ์ž์‹ ๊ณผ ๊ฐ™์ง€๋Š” ์•Š์ง€๋งŒ(NaN !== NaN์€ ์ฐธ์ž…๋‹ˆ๋‹ค), NaN์€ ์„œ๋กœ ๊ตฌ๋ณ„ํ•  ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์˜ˆ์‹œ๊ฐ€ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค.

js
const myMap = new Map();
myMap.set(NaN, "not a number");

myMap.get(NaN);
// "not a number"

const otherNaN = Number("foo");
myMap.get(otherNaN);
// "not a number"

for...of๋กœ ๋งต ์ˆœํšŒํ•˜๊ธฐ

๋งต์€ for...of ๋ฐ˜๋ณต์„ ์‚ฌ์šฉํ•˜์—ฌ ์ˆœํšŒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

js
const myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");

for (const [key, value] of myMap) {
  console.log(`${key} = ${value}`);
}
// 0 = zero
// 1 = one

for (const key of myMap.keys()) {
  console.log(key);
}
// 0
// 1

for (const value of myMap.values()) {
  console.log(value);
}
// zero
// one

for (const [key, value] of myMap.entries()) {
  console.log(`${key} = ${value}`);
}
// 0 = zero
// 1 = one

forEach()๋กœ ๋งต ์ˆœํšŒํ•˜๊ธฐ

๋งต์€ forEach() ๋ฉ”์„œ๋“œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ˆœํšŒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

js
myMap.forEach((value, key) => {
  console.log(`${key} = ${value}`);
});
// 0 = zero
// 1 = one

๋ฐฐ์—ด ๊ฐ์ฒด์™€์˜ ๊ด€๊ณ„

js
const kvArray = [
  ["key1", "value1"],
  ["key2", "value2"],
];

// Use the regular Map constructor to transform a 2D key-value Array into a map
const myMap = new Map(kvArray);
console.log(myMap.get("key1")); // "value1"

// Use Array.from() to transform a map into a 2D key-value Array
console.log(Array.from(myMap)); // Will show you exactly the same Array as kvArray

// A succinct way to do the same, using the spread syntax
console.log([...myMap]);

// Or use the keys() or values() iterators, and convert them to an array
console.log(Array.from(myMap.keys())); // ["key1", "key2"]

๋งต ๋ณต์ œํ•˜๊ธฐ์™€ ๋ณ‘ํ•ฉํ•˜๊ธฐ

Array์™€ ๊ฐ™์ด Map์€ ๋ณต์ œ๊ฐ€ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

js
const original = new Map([[1, "one"]]);

const clone = new Map(original);

console.log(clone.get(1)); // one
console.log(original === clone); // false (useful for shallow comparison)

์ฐธ๊ณ  : ๋ฐ์ดํ„ฐ ์ž์ฒด๋Š” ๋ณต์ œ๊ฐ€ ์•ˆ๋œ๋‹ค๋Š” ์‚ฌ์‹ค์„ ๋ช…์‹ฌํ•˜์…”์•ผ ํ•ฉ๋‹ˆ๋‹ค.

๋งต์€ ํ‚ค ์œ ์ผ์„ฑ์„ ์œ ์ง€ํ•œ์ฑ„๋กœ ๋ณ‘ํ•ฉ์ด ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

js
const first = new Map([
  [1, "one"],
  [2, "two"],
  [3, "three"],
]);

const second = new Map([
  [1, "uno"],
  [2, "dos"],
]);

// ๋‘ ๋งต์„ ๋ณ‘ํ•ฉํ•ฉ๋‹ˆ๋‹ค. ํ‚ค ๊ฐ’์ด ์ค‘๋ณต๋  ๊ฒฝ์šฐ ๋งˆ์ง€๋ง‰ ํ‚ค์˜ ๊ฐ’์„ ๋”ฐ๋ฆ…๋‹ˆ๋‹ค.
// ์ „๊ฐœ ๋ฌธ๋ฒ•์€ ๋งต์„ ๋ฐฐ์—ด๋กœ ๋ณ€ํ™˜ํ•ฉ๋‹ˆ๋‹ค.
const merged = new Map([...first, ...second]);

console.log(merged.get(1)); // uno
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three

๋งต์€ ๋ฐฐ์—ด๊ณผ ๋ณ‘ํ•ฉ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

js
const first = new Map([
  [1, "one"],
  [2, "two"],
  [3, "three"],
]);

const second = new Map([
  [1, "uno"],
  [2, "dos"],
]);

// ๋งต์„ ๋ฐฐ์—ด๋กœ ๋ณ‘ํ•ฉํ•˜๊ธฐ. ์ค‘๋ณต๋œ ํ‚ค๊ฐ€ ์žˆ๋‹ค๋ฉด ๋งˆ์ง€๋ง‰์— ๋ณ‘ํ•ฉ๋œ ๋งต์˜ ํ‚ค์— ํ•ด๋‹นํ•˜๋Š” ๊ฐ’์ด ์„ค์ •๋ฉ๋‹ˆ๋‹ค.
const merged = new Map([...first, ...second, [1, "eins"]]);

console.log(merged.get(1)); // eins
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three

๋ช…์„ธ

Specification
ECMAScriptยฎ 2026 Language Specification
# sec-map-objects

๋ธŒ๋ผ์šฐ์ € ํ˜ธํ™˜์„ฑ

๊ฐ™์ด ๋ณด๊ธฐ

  • Map์˜ ํด๋ฆฌํ•„์€ core-js์—์„œ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค
  • Set
  • WeakMap
  • WeakSet