2nd/10_Wiki/Topics/Domain_Programming/Topic_JavaScript/JavaScript_Maps.md

id, title, category, status, verification_status, canonical_id, aliases, duplicate_of, source_trust_level, confidence_score, created_at, updated_at, review_reason, merge_history, tags, raw_sources, applied_in, github_commit

id	title	category	status	verification_status	canonical_id	aliases	duplicate_of	source_trust_level	confidence_score	created_at	updated_at	review_reason	merge_history	tags	raw_sources	applied_in	github_commit
javascript-maps	JavaScript Maps	Frontend	draft	conceptual		Map new Map key-value pairs ES6 Map Map.set Map.get dictionary		B	0.9	2026-06-23	2026-06-23			javascript js web frontend w3schools map collection es6	https://www.w3schools.com/js/js_maps.asp

JavaScript Maps

🎯 한 줄 통찰 (One-line insight)

A JavaScript Map stores key-value pairs like a dictionary, but unlike plain objects its keys can be of any data type, it remembers insertion order, and it exposes a size property. [S1]

🧠 핵심 개념 (Core concepts)

• A Map is an object that stores key-value pairs, similar to a dictionary in other languages; keys can be of any data type. [S1]
• Maps are most similar to Objects (a unique key/value collection), but with stronger guarantees. [S1]
• Six characteristics — keys can be any type; original insertion order is remembered; item count is easy via size; optimized for frequent additions/removals; directly iterable with for...of or forEach(); original order preserved during iteration. [S1]
• Two ways to create a Map — new Map() then set() calls, or new Map([...]) with an array of [key, value] pairs. [S1]
• set() adds or updates — calling set() with an existing key changes its value. [S1]
• get() retrieves a value by its key. [S1]
• Type identity — typeof a Map returns "object", and instanceof Map returns true. [S1]

🧩 추출된 패턴 (Extracted patterns)

• set-chain construction — create empty, then set() each pair. [S1]
• Array-literal construction — pass [[k, v], ...] to new Map(). [S1]
• Upsert by key — set() doubles as insert (new key) and update (existing key). [S1]

📖 세부 내용 (Details)

A JavaScript Map is an object that can store collections of key-value pairs, similar to a dictionary in other programming languages. Maps differ from standard objects in that keys can be of any data type. Maps are similar to both Objects (unique key/value collection) and Arrays (ordered values collection), but Maps are most similar to Objects. [S1]

Map characteristics: keys can be any type; the original insertion order is remembered; the number of items is easily retrieved via the size property; optimized for frequent additions and removals; directly iterable with for...of loops or forEach(); original order preserved during iteration. [S1]

How to Create a Map — you can create a Map by passing an Array to new Map(), or by creating a Map and using set(). [S1]

Using set() — create an empty Map and set values: [S1]

// Create an empty Map
const fruits = new Map();

// Set Map Values
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

Using an Array — pass an array of [key, value] pairs to the constructor: [S1]

// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

Adding Elements — the set() method can also be used to add new elements: [S1]

fruits.set("mangos", 100);

Changing Values — set() will also change existing values: [S1]

fruits.set("apples", 200);

The get() Method — gets the value of a key: [S1]

fruits.get("apples");    // Returns 500

A JavaScript Map is an Object [S1]

// Returns object:
typeof fruits;

// Returns true:
fruits instanceof Map;

JavaScript Objects vs Maps [S1]

	Object	Map
Iterable	Not directly iterable	Directly iterable
Size property	Do not have a size property	Have a size property
Key types	Keys must be Strings (or Symbols)	Keys can be any datatype
Key ordering	Keys are not well ordered	Keys are ordered by insertion
Default keys	Have default keys	Do not have default keys

Browser Support — Map is an ES6 feature (JavaScript 2015), fully supported in all modern browsers since June 2017. [S1]

Browser	Version	Release
Chrome	51	May 2016
Edge	15	Apr 2017
Firefox	54	Jun 2017
Safari	10	Sep 2016
Opera	38	Jun 2016

🛠️ 적용 사례 (Applied in summary)

The page's own snippets are the canonical applied examples — building a fruits Map by set() calls or array literal, adding mangos, updating apples, and reading back with get(). No external project/commit applications found in the source.

💻 코드 패턴 (Code patterns)

Create a Map from an array of pairs (language: JavaScript):

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

Upsert and read:

fruits.set("apples", 200);
fruits.get("apples");

⚖️ 비교 및 선택 기준 (Comparison & decision criteria)

Per the source's Objects-vs-Maps table, prefer a Map over a plain Object when you need: direct iterability (for...of), a built-in size, keys of any data type (not just strings/symbols), reliable insertion ordering, or no inherited default keys. Use a plain Object for simple string-keyed records where those guarantees are not required. [S1]

⚖️ 모순 및 업데이트 (Contradictions & updates)

No contradictions found in the source.

✅ 검증 상태 및 신뢰도

• 상태: draft
• 검증 단계: conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
• 출처 신뢰도: B (W3Schools — widely used educational reference, not a primary standards body)
• 신뢰 점수: 0.90
• 중복 검사 결과: 신규 생성 (New discovery)

🔗 지식 그래프 (Knowledge Graph)

• 상위/루트: JavaScript Tutorial
• 관련 개념: JavaScript Map Methods, JavaScript Sets, JavaScript Set Methods
• 참조 맥락: The base concept referenced whenever an ordered, any-key key-value collection is needed.

📚 출처 (Sources)

• [S1] W3Schools — JavaScript Maps — https://www.w3schools.com/js/js_maps.asp

📝 변경 이력 (Change history)

• 2026-06-23: Initial draft synthesized from the W3Schools "JavaScript Maps" page (Astra wiki-curation, P-Reinforce v3.1 format).