38 lines
1.0 KiB
Plaintext
38 lines
1.0 KiB
Plaintext
---
|
|
title: Can you describe the main difference between a `.forEach` loop and a `.map()` loop?
|
|
subtitle: Why you would pick one versus the other?
|
|
---
|
|
|
|
To understand the differences between the two, let's look at what each function does.
|
|
|
|
## `forEach`
|
|
|
|
- Iterates through the elements in an array.
|
|
- Executes a callback for each element.
|
|
- Does not return a value.
|
|
|
|
```js
|
|
const a = [1, 2, 3];
|
|
const doubled = a.forEach((num, index) => {
|
|
// Do something with num and/or index.
|
|
});
|
|
|
|
// doubled = undefined
|
|
```
|
|
|
|
## `map`
|
|
|
|
- Iterates through the elements in an array.
|
|
- "Maps" each element to a new element by calling the function on each element, creating a new array as a result.
|
|
|
|
```js
|
|
const a = [1, 2, 3];
|
|
const doubled = a.map((num) => {
|
|
return num * 2;
|
|
});
|
|
|
|
// doubled = [2, 4, 6]
|
|
```
|
|
|
|
The main difference between `.forEach` and `.map()` is that `.map()` returns a new array. If you need the result, but do not wish to mutate the original array, `.map()` is the clear choice. If you simply need to iterate over an array, `forEach` is a fine choice.
|