Both forEach and map are used to iterate over arrays, but they differ in purpose and return value.
1️⃣ forEach
- Used for executing a function on each element of an array.
- Does not return a new array.
- Ideal for side effects (logging, updating variables, DOM manipulation).
Example:
const numbers = [1, 2, 3];
numbers.forEach(num => console.log(num * 2));
// Output: 2, 4, 6
- Returns
undefined. - Cannot be chained to produce a new array.
2️⃣ map
- Used for transforming each element in an array.
- Returns a new array of the same length.
- Ideal for creating a modified version of an array.
Example:
const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2);
console.log(doubled);
// Output: [2, 4, 6]
- Returns a new array with transformed values.
- Can be chained with other array methods (
filter,reduce, etc.).
🔹 Key Differences
| Feature | forEach | map |
|---|---|---|
| Returns | undefined | New array |
| Purpose | Side effects | Transform / create new array |
| Chaining | No | Yes |
| Original array | Not modified | Not modified |
💡 In Short:
- Use
forEach→ when you want to perform actions without creating a new array. - Use
map→ when you want to transform data and get a new array.
