the difference between for, forEach, and map

Marvlous dev 09 Dec 2019

Hello guys, I am really excited to announce you guys that this is my first article to write about a software engineering and programming, so lately I’ve been talking this topic with friend of mine, this topic so interesting to discuss so I decide to write this post.

Over the past 2 years I have been working in software industry in the first years I was being a web front end developer, then the second years I was being a software engineer or fullstack developer or web engineer, as a web engineer mostly  I spend my time working on javascript, ruby, php and in many cases I rare use for loops in javascript and any other languages. Instead, when iterating a collection or array I tend to use map often or forEach method

I don’t think I remember when was the last time I found myself needing to use a for loop for anything, I can’t imagine if my self is choosing for over map and forEach, there will be hard to debug my own code or to read my own code so that’s way I choose map and forEach

For

For me for loop is really really good if we want to teach someone a basic looping cause the familiarity of the code syntax for a newer developer or in some cases for loop is relevan if we want loop 10.000.000 array item or more than that but you need to remember run faster it might user more memory too, if you decide to use for loop you need define these three things

  • an iterator  var i = 0
  • the end point: i < array.length
  • how to iterate: i++

Let us take a look code example below:

var carBrands = [‘bmw’, ‘tesla’, ‘ford’] 
for (var i = 0; i < carBrands.length; i++){ 
 document.write(i) 
}

 

ForEach

Basically doing a loop with forEach was pretty easy, when you decide looping an array item with forEach you could do easily pass an individual function with it’s own scope, the callback function accepts three arguments value of element, index of element, and array object, scoping variable is much more easier check this link https://stackoverflow.com/questions/500431/what-is-the-scope-of-variables-in-javascript but forEach will always modify the original array

Let’s take a look code sample below 

let cars = [‘cybertruck, ‘model x’, ‘model y’]
cars.forEach((item) => console.log(item)) 

// result 

cybertruck 
model x 
model y 
undefined

 

Map

Talk about map, if we talk about map actually map was quite smilar with forEach but doesn’t modify the original array value and I prefer to use map over forEach or for loop, The strong reason cause map in performance was more faster than forEach, and Immutable, it means It cannot be changed and always return a new array

Let's take a look code example below

let brands = ['adidas', 'nike', 'rebook'] 
let newBrands = brands.map((item) =>  item)
console.log(newBrands)

//result
['adidas', 'nike', 'rebook']

 

Conclusion,

I write this article is not trying to convince you guys to use map or forEach over For loop, the most important is if you want to write a code you need to find a comfortable and something you understand, cause if you write so many code, readable code is really really matter. yeah thats all from me hope this article give you a little bit perspective about for, forEach and map, thanks.