How to Convert an Array to a Map in JavaScript
In JavaScript, it is possible to convert an array of objects into a Map object. There are three common methods to accomplish this task.
The first method is to use the Array.reduce() method. This method can be used to iterate over the array of objects, and for each object, add it to the Map object as a key-value pair. Here is an example of how to use this method:
|
1 2 3 4 5 6 7 8 9 10 |
let array = [{ id: 1, name: "John" }, { id: 2, name: "Jane" }]; let map = array.reduce((map, obj) => { map.set(obj.id, obj); return map; }, new Map()); console.log(map) |
In this example, we start with an array of objects, and we use the reduce method to iterate over the array. For each object, we add it to the Map object as a key-value pair, where the key is the object’s id property and the value is the object itself.
Another way to convert an array of objects into a Map object in JavaScript is to use the Array.map() method to create an array of key-value pairs, and then pass this array to the Map() constructor to create a new Map object. This method allows for efficient and easy conversion of an array of objects into a Map object.
|
1 2 3 4 5 6 7 |
let array = [{ id: 1, name: "John" }, { id: 2, name: "Jane" }]; let map = new Map(array.map(obj => [obj.id, obj])); console.log(map) |
Both of these methods are efficient and easy to use, and which one you choose will depend on your specific needs and personal preferences.
It’s worth noting that these methods are only suitable if the array of objects has a unique key property, otherwise it will overwrite the previous key-value pair with the new one.
Read: How to Convert a Map to an Array in JavaScript
Using the forEach() Method
First, create a new Map object, and then add entries for all the elements of the array to the Map by calling the Map.set() method in the callback passed to the Array.forEach() method. Here’s an example of how this can be done:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
let array = [ { id: 1, name: "John" }, { id: 2, name: "Jane" }, { id: 3, name: "Bob" }, ]; let map = new Map(); array.forEach((obj) => map.set(obj.id, obj)); console.log(map); |
This method also works fine, but it’s less efficient than using reduce or the Map() Constructor because it requires iterating over the array twice: once to create the Map, and then to add the key-value pairs.
Have you found this to be useful?
Sharing this article will help support my work.
