- JavaScript Maps
- Essential Map Methods
- How to Create a Map
- The new Map() Method
- Example
- The set() Method
- Example
- Example
- The get() Method
- Example
- The size Property
- Example
- The delete() Method
- Example
- The has() Method
- Example
- Try This:
- JavaScript Objects vs Maps
- Differences between JavaScript Objects and Maps:
- The forEach() Method
- Example
- The entries() Method
- Example
- Browser Support
- COLOR PICKER
- Report Error
- Thank You For Helping Us!
- Map() constructor
- Syntax
- Parameters
- Examples
- Creating a new Map
- Specifications
- Browser compatibility
- See also
- Found a content problem with this page?
- MDN
- Support
- Our communities
- Developers
- JavaScript Maps
- Map Methods
- How to Create a Map
- new Map()
- Example
- Map.set()
- Example
- Example
- Map.get()
- Example
- Map.size
- Example
- Map.delete()
- Example
- Map.clear()
- Example
- Map.has()
- Example
- Try This:
- Maps are Objects
- Example
- Example
- JavaScript Objects vs Maps
- Differences between JavaScript Objects and Maps:
- Map.forEach()
- Example
- Map.entries()
- Example
- Map.keys()
- Example
- Map.values()
- Example
- Example
- Objects as Keys
- Example
- Example
- Browser Support
JavaScript Maps
A Map holds key-value pairs where the keys can be any datatype.
A Map remembers the original insertion order of the keys.
Essential Map Methods
Method | Description |
---|---|
new Map() | Creates a new Map |
set() | Sets the value for a key in a Map |
get() | Gets the value for a key in a Map |
delete() | Removes a Map element specified by the key |
has() | Returns true if a key exists in a Map |
forEach() | Calls a function for each key/value pair in a Map |
entries() | Returns an iterator with the Creating map in javascript pairs in a Map |
Property | Description |
size | Returns the number of elements in a Map |
How to Create a Map
You can create a JavaScript Map by:
The new Map() Method
You can create a Map by passing an Array to the new Map() constructor:
Example
The set() Method
You can add elements to a Map with the set() method:
Example
// Create a Map
const fruits = new Map();
// Set Map Values
fruits.set(«apples», 500);
fruits.set(«bananas», 300);
fruits.set(«oranges», 200);
The set() method can also be used to change existing Map values:
Example
The get() Method
The get() method gets the value of a key in a Map:
Example
The size Property
The size property returns the number of elements in a Map:
Example
The delete() Method
The delete() method removes a Map element:
Example
The has() Method
The has() method returns true if a key exists in a Map:
Example
Try This:
JavaScript Objects vs Maps
Differences between JavaScript Objects and Maps:
Object | Map | |
---|---|---|
Iterable | Not directly iterable | Directly iterable |
Size | Do not have a size property | Have a size property |
Key Types | Keys must be Strings (or Symbols) | Keys can be any datatype |
Key Order | Keys are not well ordered | Keys are ordered by insertion |
Defaults | Have default keys | Do not have default keys |
The forEach() Method
The forEach() method calls a function for each key/value pair in a Map:
Example
// List all entries
let text = «»;
fruits.forEach (function(value, key) text += key + ‘ = ‘ + value;
>)
The entries() Method
The entries() method returns an iterator object with the Creating map in javascript in a Map:
Example
Browser Support
JavaScript Maps are supported in all browsers, except Internet Explorer:
COLOR PICKER
Report Error
If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:
Thank You For Helping Us!
Your message has been sent to W3Schools.
Top Tutorials
Top References
Top Examples
Get Certified
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.
Map() constructor
The Map() constructor creates Map objects.
Syntax
Note: Map() can only be constructed with new . Attempting to call it without new throws a TypeError .
Parameters
An Array or other iterable object whose elements are key-value pairs. (For example, arrays with two elements, such as [[ 1, ‘one’ ],[ 2, ‘two’ ]] .) Each key-value pair is added to the new Map .
Examples
Creating a new Map
const myMap = new Map([ [1, "one"], [2, "two"], [3, "three"], ]);
Specifications
Browser compatibility
BCD tables only load in the browser
See also
Found a content problem with this page?
This page was last modified on Apr 12, 2023 by MDN contributors.
Your blueprint for a better internet.
MDN
Support
Our communities
Developers
Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.
JavaScript Maps
A Map holds key-value pairs where the keys can be any datatype.
A Map remembers the original insertion order of the keys.
A Map has a property that represents the size of the map.
Map Methods
Method | Description |
---|---|
new Map() | Creates a new Map object |
set() | Sets the value for a key in a Map |
get() | Gets the value for a key in a Map |
clear() | Removes all the elements from a Map |
delete() | Removes a Map element specified by a key |
has() | Returns true if a key exists in a Map |
forEach() | Invokes a callback for each key/value pair in a Map |
entries() | Returns an iterator object with the Creating map in javascript pairs in a Map |
keys() | Returns an iterator object with the keys in a Map |
values() | Returns an iterator object of the values in a Map |
Property | Description |
---|---|
size | Returns the number of Map elements |
How to Create a Map
You can create a JavaScript Map by:
new Map()
You can create a Map by passing an Array to the new Map() constructor:
Example
Map.set()
You can add elements to a Map with the set() method:
Example
// Create a Map
const fruits = new Map();
// Set Map Values
fruits.set(«apples», 500);
fruits.set(«bananas», 300);
fruits.set(«oranges», 200);
The set() method can also be used to change existing Map values:
Example
Map.get()
The get() method gets the value of a key in a Map:
Example
Map.size
The size property returns the number of elements in a Map:
Example
Map.delete()
The delete() method removes a Map element:
Example
Map.clear()
The clear() method removes all the elements from a Map:
Example
Map.has()
The has() method returns true if a key exists in a Map:
Example
Try This:
Maps are Objects
Example
instanceof Map returns true:
Example
JavaScript Objects vs Maps
Differences between JavaScript Objects and Maps:
Object | Map |
---|---|
Not directly iterable | Directly iterable |
Do not have a size property | Have a size property |
Keys must be Strings (or Symbols) | Keys can be any datatype |
Keys are not well ordered | Keys are ordered by insertion |
Have default keys | Do not have default keys |
Map.forEach()
The forEach() method invokes a callback for each key/value pair in a Map:
Example
// List all entries
let text = «»;
fruits.forEach (function(value, key) text += key + ‘ = ‘ + value;
>)
Map.entries()
The entries() method returns an iterator object with the Creating map in javascript in a Map:
Example
Map.keys()
The keys() method returns an iterator object with the keys in a Map:
Example
Map.values()
The values() method returns an iterator object with the values in a Map:
Example
You can use the values() method to sum the values in a Map:
Example
Objects as Keys
Being able to use objects as keys is an important Map feature.
Example
// Create a Map
const fruits = new Map();
// Add new Elements to the Map
fruits.set(apples, 500);
fruits.set(bananas, 300);
fruits.set(oranges, 200);
Remember: The key is an object (apples), not a string («apples»):
Example
Browser Support
JavaScript Maps are supported in all browsers, except Internet Explorer: