Array.prototype.map() expects a return value from arrow function :Fix

by

The error prompt “Array.prototype.map() expects a return value from Arrow Function” message may pop up in Javascript. There are several scenarios where you may face this problem and there are mutiple wyas of bypassing this problem.  Generally, while using the “Array.prototype.map()” function, if it returns nothing (null) while the execution of the code. Otherwise, if you have done a mistake in the prior steps involving the filter method, the same error message may surface as well.

Fix – 1 Replace the parenthesis

Normally the parenthesis written in the code doesn’t induce any error. But, in this case, the use of {}, instead of () in the code.

Example – This snippet of the code –



{
If (Object.keys(t.pr.part).map((par) => {
          if(t.pr.part[par].identifiant_user === getUrlParams(window.location.hash).identifiant_user)
           this.setState({
              par:t.pr.part[part].id_user
})
})
}

This part of the code will get the “Expected to return a value in arrow function” message. To fix this, simply, change this “({” to “((” in the code.

Like the code snippet willl look like this –

Object.keys(t.pr.part).map((par) => {
          if(t.pr.part[par].identifiant_user === getUrlParams(window.location.hash).identifiant_user)
           this.setState((
              par:t.pr.part[part].id_user
))
)}
))

 

1st one min 1

 

This way, you can troubleshoot the code.

 

Fix 2 – Use the ForEach instead Array.map

Instead of using the Array.map function use the Array.ForEach function in the code to achieve the same results.

The Foreach function instead of using the map method can be used if the particular function of the code doesn’t need to return any value.

Example –

ListService?.map((service, j) => {
return (
<Main Service key={service.id} {...{service, num: j }} />
)
})

 

You can replace the main map function and alter the code following this way –

ListService?.forEach((item) => {
csvData.push({
"Name": item?.name,
"Work": item?.desc,
})
})

 

foreach min

 

This way, you may bypass the Array.map function completely and avoid getting the return value message.

 

Fix 3 – Return the null value

You should include an else condition at the end of the code and let it return the null value, if the Array.map function can’t iterate any value.

It is very easy. Just include this –

else {
    return null:
       }
}

 

else return null value min

 

Just be careful about the parenthesis and execute the code. Next, compile and run the code and test.



Whenever the code fails, it will atleast iterate a null value, not the “Array.prototype.map() expects a return value from Arrow Function” error message.

 

Fix 4 – Use the filter code

There is another way of dealing with this problem. Use the “ArrayPrototype.filter()” in the place of Array.prototype.map(), if the requirement is to segregate values based on some parameters.

The main syntax for this code is –

let newArray = array.filter(callback(element[, index[, array]])[, thisArg])

 

This is a buit-in method that can filter out the entire set of data that meets the condition of the specified function.

These are the ways you can troubleshoot the return value message in Javascript.



Read More: