Receiving error while iterating over a map in javascript in LWC - “e.map is not a function”

2.0K Asked by DeepakMistry in Salesforce , Asked on Jul 13, 2021

I am getting a different error and can not seem to figure it out now for a coupe of hours, Here's my code :

createMapMarkers(boatData) { console.log('DATA :'+boatData); const newMarkers = boatData.map((boat) => { return { title : boat.Name, location : { Latitude : boat.Geolocation__Latitude__s, Longitude : boat.Geolocation__Longitude__s } } }); newMarkers.unshift({ title : LABEL_YOU_ARE_HERE, icon : ICON_STANDARD_USER, location : { Latitude : this.latitude, Longitude : this.longitude } }); this.mapMarkers = newMarkers; this.isLoading = false; }

I am getting this error : modules/c/boatsNearMe.js:4 Uncaught (in promise) TypeError: LWC component's u/wire target property or method threw an error during value provisioning. Original error: [e.map is not a function] at h.createMapMarkers (modules/c/boatsNearMe.js:4) at h.wiredBoatsJSON (modules/c/boatsNearMe.js:4) at b.dispatchEvent (aura_prod.js:6) at yi (/components/force/lds.js:2) at eval (/components/force/lds.js:2) at eval (/components/force/lds.js:2) I checked the piece of code by running on Here on Mozilla and it worked perfectly. It is only a throwing error in LWC.

why getting the exception “map is not a function”?

Answered by Chris EVANS

The above code has correct syntax provided boatData is an array. It looks like the Javascript object you have boatData is not an Array and hence you get an exception that .map is not a function. You can easily reproduce this with below Javascript code

let object_x = {}; object_x.map( x => { return x; });

This will result in an error Error: object_x.map is not a function

Looks like the boatData is a JSON string and you can use JSON.parse(boatData) to cast to the Javascript array.

Receiving error while iterating over a map in javascript in LWC - “e.map is not a function”

Your Answer