В чем разница между Map и ForEach в JavaScript?
Если вы работали с JavaScript, вероятно, вам приходилось сталкиватся с двумя, казалось бы, похожими методами: Array.prototype.map() и Array.prototype.forEach(). Давайте разберёмся в чём-же разница?
На портале для разработчиков "MDN" есть вот такое определение:
forEach() — Выполняет указанную функцию для каждого элемента массива.
map() — создаёт новый массив с результатом вызова указанной функции для каждого элемента массива.
Что именно это означает?
Метод forEach() фактически ничего не возвращает (undefined). Он просто вызывает указанную функцию для каждого элемента вашего массива. Этот каллбек разрешает мутировать вызывающий массив.
В то времк как, метод map() вызовет указанную функцию для каждого элемента массива. Разница в том, что map() использует возвращаемые значения и фактически возвращает новый массив того же размера.
Примеры кода
Рассмотрим на примере массива чисел.
let arr = [1, 2, 3, 4, 5];
Если бы мы хотели умножить на два каждый элемент массива, попробуем сделать это методом, forEach и затем map.
Обратите внмание — вы никогда не получите return из метода forEach значения просто отбрасываются.
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]