When iterating through an array, when should we use for, forEach, or map?

Here's a quick summary of each.

for()

• Performance: Built-in function. Faster than the other iteration methods due to less overhead (e.g. no callbacks to initialize). Use it for large arrays.

• Short-circuiting: can use the break statement to stop the iteration.

• Beware of ES6 syntax--e.g. for (const key in object) for iterating objects, or for (const element of array) for iterating arrays--essentially this syntax turns the for() loop into a forEach loop--meaning, no short-circuiting available anymore. (Note: one is in and the other uses of)

forEach()

• Takes a callback function: arr.forEach(callback)

• It has 3 params: value, index, and the original array. See example:
  

> [1, 2].forEach((value, index, arr) => console.log(value, index, arr))
1 0 [ 1, 2 ]
2 1 [ 1, 2 ]
undefined

The undefined is the returned value of the forEach() call.

• forEach ALWAYS iterate through the entire array. Not good for large arrays.

• It does NOT wait for asynchronous tasks to complete.

map()

• Returns an array of the return values of the callback function. Everything else behaves the same as a forEach() call.

• The keys of a map() is ordered, it follows the order of insertion for objects. (While Object.keys() does not guarantee the order.)

• It does NOT wait for asynchronous tasks to complete. (Worth repeating).

• Because it returns an array, you can use map() with asynchronous calls like this: await Promise.all(array.map(...))