JavaScript From Beginner To Advanced

0% completed

Previous
Next
JavaScript - Maps

Maps in JavaScript are a collection of keyed data items, just like an Object. However, Maps allow keys of any type, offering more flexibility and power in handling data than Objects. Maps maintain the insertion order of elements, which can be crucial for certain algorithms.

Image

Syntax

To create a Map, you can use the Map() constructor, which optionally accepts an iterable (such as an array) of key-value pairs.

Javascript
Javascript
. . . .
  • iterable is an Array or any iterable object whose elements are key-value pairs (arrays with two elements).

Example of Creating a Map

Javascript
Javascript
. . . .
  • Above code initializes a Map fruits with three entries: apples, bananas, and oranges, with their respective quantities.
  • Each item in the array is a key-value pair, showing how Maps can store data in a structured format.

Map Properties in Table Format

Maps come with properties that help to inspect the collection:

PropertyDescription
sizeReturns the number of key/value pairs in the Map object.

Map Methods in Table Format

Maps offer a variety of methods to manipulate the data:

MethodDescription
set(key, value)Adds or updates an element with a specified key and value to the Map object.
get(key)Returns the value associated with the key, or undefined if there is none.
has(key)Returns a boolean asserting whether a value has been associated with the key in the Map object or not.
delete(key)Removes any value associated with the key.
clear()Removes all key/value pairs from the Map object.
entries()Returns a new Iterator object that contains an array of [key, value] for each element in the Map object in insertion order.
keys()Returns a new Iterator object that contains the keys for each element in the Map object in insertion order.
values()Returns a new Iterator object that contains the values for each element in the Map object in insertion order.
forEach(callbackFn[, thisArg])Executes a provided function once per each key/value pair in the Map object, in insertion order.

Examples

Example 1: Using set and get Methods

Javascript
Javascript

. . . .
  • A Map books is created without any entries.
  • The set method adds two books as keys with their authors as values.
  • The get method retrieves the author of "1984".

Example 2: Checking for a Key with has Method

Javascript
Javascript

. . . .
  • Above code checks if "1984" is a key in the books Map, returning true because it was added previously.

Map vs. Object Table

Comparing Maps to Objects:

FeatureMapObject
Key TypesAny value typeStrings and Symbols
Order of ElementsMaintains insertion orderNo guaranteed order
Size PropertyYes (size)No, must be computed manually
IterationDirectly iterableRequires fetching keys or values

Maps provide advantages over Objects when a collection of key-value pairs is needed, especially when complex keys or order are important.

.....

.....

.....

Like the course? Get enrolled and start learning!
Previous
Next