What is Map in JavaScript

Learn what Map is in JavaScript, how it differs from plain objects, how to create and use maps, and practical patterns for real projects with clear examples and best practices.

JavaScripting Team

February 3, 2026·5 min read

JS Learn JavaScript Objects Code Snippets

Map

Map is a built-in JavaScript data structure that stores key-value pairs and preserves insertion order. It allows keys of any type, unlike plain objects.

What Map is and how it works

What is map in javascript? Map is a built-in JavaScript data structure that stores key-value pairs and preserves insertion order. It enables you to attach any type of value as a key and any type as a value, which makes it highly flexible for real-world data modeling. The Map API is designed for clarity: you add entries with set, retrieve them with get, check existence with has, and obtain the count with size. Internally, Map maintains entries in an ordered sequence, so iteration always follows the order of insertion. When you need reliable order and versatile keys, Map is often a better choice than a plain object.

Here is a concise example:

const userRoles = new Map();
userRoles.set('alice', 'admin');
userRoles.set({ id: 1 }, { name: 'Alice', level: 2 });
console.log(userRoles.size); // 2
console.log(userRoles.get('alice')); // 'admin'

This snippet illustrates two important ideas: first, keys can be non-primitive objects as well as strings; second, size tracks the number of entries, not a numeric index. If you need a collection that treats keys as true values and maintains a stable order, Map is a natural fit. According to JavaScripting, this pattern often leads to cleaner state management in interactive frontends.

Core features of Map

Maps come with a set of features that align with common data-structuring needs in modern JavaScript development:

Keys can be any value: strings, numbers, objects, or functions. This makes Map ideal for indexing complex data structures or for using composite keys.
Insertion order is preserved: entries appear in the order they were added, which simplifies debugging and user-facing displays.
Size and iteration: the size property gives you how many entries are present, and you can iterate with for...of, or use entries, keys, and values to tailor traversal.
Efficient lookups and updates: set and get provide fast access to values by their keys, while has checks presence without retrieving.
Clear separation from plain objects: Maps are disjoint from the prototype chain, so they avoid accidental property collisions.

Example showing varied keys and iteration:

const map = new Map();
map.set('text', 42);
map.set({ id: 2 }, [1,2,3]);
for (const [k, v] of map) {
  console.log(k, v);
}

In practical terms, Map shines when you must model relationships where keys aren’t restricted to strings and when you want deterministic iteration order. JavaScripting analysis highlights how this flexibility reduces boilerplate and aligns with modern JavaScript practices.

Map vs Object: choosing the right tool

There is a natural question: when should you use Map instead of a plain Object? Here are the key differences to guide decision making:

Keys: Map accepts any value as a key, including objects and functions. Plain Objects coerce keys to strings unless they are Symbols, which can lead to surprising behavior when you use non-string keys.
Order: Map guarantees insertion order for its entries. Object property order is defined by the specification but can be confusing in practice, especially with numeric keys.
Iteration: Map is inherently iterable with for...of and has dedicated methods. Objects require separate steps such as Object.keys or Object.entries for traversal.
Size: Map exposes size directly. For Objects, you must compute the number of own enumerable properties (Object.keys(obj).length).
Serialization: Map is not serialized by JSON.stringify by default. Objects serialize naturally to JSON when their values are JSON-compatible.

Practical takeaway: use Map when you need non-string keys, stable iteration order, and concise APIs for dynamic datasets. Use plain Objects when you have simple string-key maps and want straightforward JSON-like serialization.

Creating, updating, and retrieving values in Map

Creating a Map is simple and expressive:

const scores = new Map();
scores.set('alice', 10);
scores.set('bob', 7);

Updating and retrieving values is also straightforward:

scores.set('alice', 15); // update existing key
console.log(scores.get('alice')); // 15
console.log(scores.has('bob')); // true

A few notes:

The size property reflects the number of entries, not the range of numeric indices.
Keys are stored by reference for objects, so two distinct object literals are different keys even if they look similar.
You can delete a key with delete and clear all entries with clear.

As you scale data modeling, consider how you will access and mutate state. Map provides a clean, readable API that helps keep your data logic predictable, especially when keys are not simple strings.

Iterating over Map entries and keys

Map supports multiple traversal patterns depending on your use case:

Simple iteration over [key, value] pairs:

for (const [key, value] of scores) {
  console.log(key, value);
}

Iterating keys or values separately:

for (const key of scores.keys()) {
  console.log(key);
}
for (const value of scores.values()) {
  console.log(value);
}

Using forEach for compatibility with functional patterns:

scores.forEach((value, key) => {
  console.log(key, value);
});

Important caveat: if your project consumes JSON data, remember that Map is not serialized by default. Convert to an array first, for example with [...scores] or Array.from(scores), before serializing. For interoperability, you can store entries as an array of pairs when needed.

Practical patterns, caveats, and best practices

Practical tips help you use Map effectively in real projects:

Converting Map to and from arrays: Convert to arrays with Array.from(map.entries()) or spread syntax [...map]. Converting back requires new Map(arrayOfPairs).
JSON serialization: If you need to persist maps, convert to an array of pairs and stringify that array, then reconstruct with new Map(parsedArray).
Performance considerations: Maps perform well for frequent insertions and lookups, especially when keys are objects. For dense numeric keys with predictable ranges, arrays may be faster but less flexible.
When to avoid Map: If your data needs strict JSON interchange or simple key-value storage with string keys, a plain object may be simpler and lighter. Also consider WeakMap for object-keyed data when you do not need enumeration and want automatic garbage collection.
Integration patterns: If you are mixing Map with objects, you can use a Map to index objects by complex keys and maintain separate objects for serialization or UI rendering.

In short, Map offers a robust toolkit for dynamic, non-string keys and ordered data. JavaScripting information suggests adopting Map in scenarios where the flexibility and iteration semantics save code and reduce edge cases, particularly in frontend state management and data modeling tasks.

Authority sources and further reading

To deepen your understanding of Map in JavaScript, consult well-regarded references:

MDN Web Docs on Map: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
ECMA International Map specification: https://262.ecma-international.org/11.0/#sec-map
JavaScript.info Map guide: https://javascript.info/map-set

These sources cover the Map constructor, its methods, iteration semantics, and practical usage patterns with examples. They provide formal definitions and a range of real-world scenarios to help you apply Map confidently in your projects.

Questions & Answers

What is Map in JavaScript?

Map is a built-in JavaScript data structure that stores key-value pairs with keys of any type and preserves insertion order. It provides a straightforward API for adding, retrieving, and iterating entries.

What is the difference between Map and Object?

Map accepts any value as a key and preserves insertion order, with a size property for entry count. Objects have string or symbol keys and rely on property order that is less predictable in practice.

How do you create a Map?

Create a Map with new Map(), then add entries using set. You can also pass an iterable of key-value pairs to the constructor.

How do you iterate over a Map?

You can use for...of to loop over entries, or use keys, values, and forEach for broader patterns.

Can Map keys be objects?

Yes, Map allows any value as a key, including objects and functions. The key identity is based on reference equality.

Is Map JSON serializable?

Map cannot be serialized by JSON.stringify by default. Convert to an array of entries first, then stringify, and reconstruct if needed.