DEV Community

Cover image for Difference between forEach and map.
k.Jyothi Prakash Reddy
k.Jyothi Prakash Reddy

Posted on • Updated on

Difference between forEach and map.

Javascript has some handy methods which is usefull to iterate arrays.The most two common methods is Array.prototype.forEach() and can iterate arrays with both methods but output is different.This methods is unclear for many developers, espescially for beginners.


The map() method creates a new array every time with the populated results of calling a provided function on every element in the calling array.

The forEach() method executes with the provided function once for each array element.

Return value

The major difference between map() and forEach() is returning returns new array with transformed elements based on the function which you written and even if they do same job, The returning value is undefined.

let users=["jyothiprakash","bhanu","nikitha"]
  return {_id:d}
//>>>>[{_id: "jyothiprakash"},{_id: "bhanu"},{_id: "nikitha"}]

const newArray=users.forEach((d)=>{
  return {_id:d}
//>>>>>>>>>>>>>return value: undefined

Enter fullscreen mode Exit fullscreen mode

Ability to chain

The difference between map() and forEach() is chain with other is chainable but forEach isn't.

This means map can chain with other methods like reduce(),sort() etc.But that is not possible with forEach because it will return undefined.

let data=[1,2,3,4,5]

// return value:30

let res=data.forEach((d)=>d*2).reduce((total,value)=>total+value)

//Cannot read properties of undefined (reading 'reduce')"
Enter fullscreen mode Exit fullscreen mode

when to use map()? and when to use forEach()?

Choice between forEach and map is depends on your usecase.

If you want to change,alternate or use data you can pick map because it will return a new array.

If you don't want returning array you can use forEach or even for loop.

Final Thoughts

1.Just about anything you can with forEach() and map() methods. allocates memory and always stores return value.forEach through away return values and always return undefined.

3.forEach will allow a callback function to mutate current array but map won't mutate current array instead return new array.

I hope this post will clear difference between map and forEach methods.If there are more methods please mention in comment section.

If this post is helpful please click on ❤️ Tab.


Top comments (2)

alibahaari profile image
Ali Bahaari

👍🏻 map method is as well as some other methods like filter and find which return a new array.

jyothiprakashk profile image
k.Jyothi Prakash Reddy

Yes,We can use those methods also.