JavaScript: В чем разница между Map и ForEach?

Согласно MDN: forEach() выполняет указанную функцию для каждого элемента массива. map() создаёт новый массив с результатом вызова указанной функции для каждого элемента массива.

Ключевые различия

forEach() возвращает undefined — просто вызывает функцию для каждого элемента и позволяет изменять исходный массив. map() возвращает новый массив, использует возвращаемые значения и оставляет исходный массив неизменным.

Примеры кода

// forEach — модифицирует исходный массив
let arr = [1, 2, 3, 4, 5];
arr.forEach((num, index) => {
  return arr[index] = num * 2;
});
// arr = [2, 4, 6, 8, 10]

// map — создаёт новый массив
let doubled = arr.map(num => {
  return num * 2;
});
// doubled = [2, 4, 6, 8, 10]

Производительность

По результатам тестирования на jsPerf: map() работает примерно на 82% быстрее, чем forEach().

Когда что использовать

Используйте forEach() для побочных эффектов: вывод в консоль, сохранение в БД, работа с DOM. Используйте map() при трансформации данных — особенно при цепировании с filter() и reduce().

Обе функции решают схожие задачи, но map() предпочтительнее для функционального стиля программирования благодаря скорости и возвращаемому массиву.