Initialize a map in JavaScript

This post will discuss how to initialize a map in JavaScript.

There are several ways to initialize a map in JavaScript, which is a collection of key-value pairs that can store any type of data. A map remembers the original insertion order of the keys and has some useful functions and properties. Here are some common functions to initialize a map:

1. Create a Map from an array

One way to initialize a map is to use the Map() constructor and pass an iterable object that contains key-value pairs as an argument. For example, we can pass an array of arrays, where each subarray has two elements: the first one is the key and the second one is the value.

// Create a 2D array of key-value pairs

let arr = [["name", "Anne"], ["age", 20], ["hobby", "cycling"]];

// Create a map from a 2D array of key-value pairs

let map = new Map(arr);

// Map(3) { 'name' => 'Anne', 'age' => 20, 'hobby' => 'cycling' }

console.log(map);

Download Run Code

The array can also be an array of objects, where each object has a key and a value property. For example:

// Create an array of objects

let objArr = [

{key: "name", value: "Anne"},

{key: "age", value: 20},

{key: "hobby", value: "cycling"}

];

// Create a map from an array of objects

let map = new Map(objArr.map(obj => [obj.key, obj.value]));

// Map(3) { 'name' => 'Anne', 'age' => 20, 'hobby' => 'cycling' }

console.log(map);

Download Run Code

2. Using `Map.set()` function

Another way to initialize a map is to create an empty map using the Map() constructor without any arguments, and then use the set() function to add key-value pairs to the map. The set() function takes a key and a value as parameters and returns the map object, so we can chain multiple calls to the function. This is a way to add key-value pairs to an existing map or an empty map.

// Create an empty map

let map = new Map();

// Add key-value pairs using the set function

map.set("name", "Anne")

.set("age", 20)

.set("hobby", "cycling");

// Map(3) { 'name' => 'Anne', 'age' => 20, 'hobby' => 'cycling' }

console.log(map);

Download Run Code

3. Using `Object.entries()` function

Another way to initialize a map is to use the Object.entries() function to convert an object literal into an array of key-value pairs, and then pass it to the Map() constructor to create a map with the same keys and values as the object.

// Create an object

let myObj = {

name: "Anne",

age: 20,

hobby: "cycling"

};

// Create a map from the object using Object.entries

let map = new Map(Object.entries(myObj));

// Map(3) { 'name' => 'Anne', 'age' => 20, 'hobby' => 'cycling' }

console.log(map);

Download Run Code

4. Create a `Map` from a `Set`

We can also create a new map from an iterable object, such as a set, with the spread operator (…) and the map() function, using the collection elements as Map’s keys and the desired value as Map’s value:

let set = new Set(["name", "age", "hobby"]);

let map = new Map([...set].map(key => [key, null]));

// Map(3) { 'name' => null, 'age' => null, 'hobby' => null }

console.log(map);

Download Run Code

5. Create copy of an existing Map

If we need to create a copy of an existing map, we can pass the another map as an argument for the Map() constructor. For example:

// Create a map

let map = new Map([["name", "Anne"], ["age", 20], ["hobby", "cycling"]]);

// Create a copy of existing map

let copy = new Map(map);

// Map(3) { 'name' => 'Anne', 'age' => 20, 'hobby' => 'cycling' }

console.log(copy);

Download Run Code

That’s all about initializing a map in JavaScript.

Initialize a map in JavaScript

1. Create a Map from an array

2. Using Map.set() function

3. Using Object.entries() function

4. Create a Map from a Set

5. Create copy of an existing Map

Share this:

2. Using `Map.set()` function

3. Using `Object.entries()` function

4. Create a `Map` from a `Set`