Solve - object.map is not a function Error in JavaScript

avatar

Borislav Hadzhiev

Last updated: Jul 25, 2022

banner

Check out my new book

Solve - object.map is not a function Error #

The "object.map is not a function" error occurs because the map method is not implemented on objects. To iterate over an object, use the Object.keys() method to get an array of the object's keys and call the map() method on the array of keys.

typeerror object map is not a function

Here is an example of how the error occurs.

index.js
const obj = { name: 'James', country: 'Chile', }; // ⛔️ TypeError: object.map is not a function obj.map(element => { console.log(element); });

To solve the error, use the Object.keys method to get an array of the object's keys and call the Array.map method on the array.

index.js
const obj = { name: 'James', country: 'Chile', }; // 👇️ ['name', 'country'] console.log(Object.keys(obj)); const result = Object.keys(obj).map(key => { console.log(key); // 👉️ name, country console.log(obj[key]); // 👉️ James, Chile return {[key]: obj[key]}; }); // 👇️ [{name: 'James'}, {country: 'Chile'}] console.log(result);

The Object.keys() method returns an array of the object's keys, on which we can call the Array.map() method.

Note that you can also use the Object.values() method to get an array of the object's values.

index.js
const obj = { num1: 4, num2: 8, }; // 👇️ [4, 8] console.log(Object.values(obj)); const result = Object.values(obj).map(value => { console.log(value); // 👉️ 4, 8 return value * 2; }); // 👇️ [8, 16] console.log(result);
If you only need the values of the object, you can get an array of the object's values using the Object.values method. Then you can iterate over the array using the Array.map method.

If you need the keys and values of an object in an array, use the Object.entries method.

index.js
const obj = { name: 'James', country: 'Chile', }; // 👇️ [['name', 'James'], ['country', 'Chile']] console.log(Object.entries(obj)); const result = Object.entries(obj).map(([key, value]) => { console.log(key); // 👉️ name, country console.log(value); // 👉️ James, Chile return {[key]: value}; }); // 👇️ [{name: 'James'}, {country: 'Chile'}] console.log(result);

The Object.entries() method returns an array of arrays, where the inner arrays consist of 2 elements - the key and the value.

We used array destructuring to destructure the key and value from each inner array and used the variables directly in our map() method.

Use the search field on my Home Page to filter through my more than 3,000 articles.