To convert an array to a map in JavaScript, use the array.map() method and new Map() constructor. The map() is a built-in JavaScript method that creates a new array and then passes that array to the new Map() constructor to create a Map object.
What is Map in JavaScript
A Map contains key-value pairs where the keys can be any datatype. In addition, the Map has a property that represents the size of the map. The Map is Introduced in ES6 as a Data structure that is a collection of key-value pairs, similar to an object.
To create a Map object in JavaScript, use the new Map() constructor.
Example
const cars = new Map([
["bmw", "red"],
["audi", "black"],
["mercedez", "white"]
]);
console.log(cars)
Output
Map(3) { 'bmw' => 'red', 'audi' => 'black', 'mercedez' => 'white' }
You can see the Map object, which has three key-value pairs.
In this tutorial, we want to convert an array of objects to Map Object.
What is Array.map() in JavaScript
The array.map() is a built-in JavaScript function that creates a new array by calling a function for every array element. The map() function map() calls a function once for each element in the array.
To map an array of elements in JavaScript, use the array.map() method.
In our example, every element is an array of objects, and we want to convert this array of objects into a Map object.
Syntax
Array.map( object => return{ object.key, object.value } )
Arguments
The Array.map() function takes an object as an argument and returns a new array.
How to create an array of objects in JavaScript
To create an array of objects in JavaScript, use the square brackets([ ]) and put the key-value pairs between those brackets separated by a comma.
const employees = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Calvin'},
{ id: 4, name: 'Doe' },
{ id: 5, name: 'Finn' }
];
You can see that we created an array named employees, which contains objects with id and name properties.
Converting Array to Map in Javascript
To convert an array of objects into a Map object, use the array.map() method and get the output and pass that output to the new Map() constructor.
const employees = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Calvin' },
{ id: 4, name: 'Doe' },
{ id: 5, name: 'Finn' }
];
const MapOfEmployees = new Map(
employees.map(object => {
return [object.id, object.name];
}),
);
console.log(MapOfEmployees);
Output
Map(5) {
1 => 'Alice',
2 => 'Bob',
3 => 'Calvin',
4 => 'Doe',
5 => 'Finn'
}
Here, we created a MapOfEmployees, a new “Map” object. We successfully converted an array of objects into a Map object.
Array objects to Map object using forEach and Map.set()
The Map.set() is a built-in JavaScript method that sets the value for a key in a Map. The forEach() is a built-in JavaScript method that calls a function for each element in an array.
To convert an array of objects to Map, use the forEach() method, iterate through every array element and predefine an empty Map object. Then inside the forEach() method, set the object key-value of the Map object.
const employees = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Calvin' },
{ id: 4, name: 'Doe' },
{ id: 5, name: 'Finn' }
];
const MapOfEmployees = new Map();
employees.forEach(object => {
MapOfEmployees.set(object.id, object.name);
});
console.log(MapOfEmployees);
Output
Map(5) {
1 => 'Alice',
2 => 'Bob',
3 => 'Calvin',
4 => 'Doe',
5 => 'Finn'
}
You can see that we created a Map object out of an array of objects in JavaScript.
Conclusion
There are two ways to convert an array to Map in JavaScript.
- Using Array.map() method + new Map()
- Using Array.forEach() method + Map.set()
We saw both ways, and it depends on developers which path they choose to achieve their goal.
That’s it for this tutorial.
See also
How to flatten an array of objects

Krunal Lathiya is a Software Engineer with over eight years of experience. He has developed a strong foundation in computer science principles and a passion for problem-solving. Krunal has experience with various programming languages and technologies, including PHP, Python, and expert in JavaScript. He is comfortable working in front-end and back-end development.