Основное различие между этими двумя методами является концептуальным и стилистическим: вы используете forEach, когда хотите что-то сделать до или с каждым элементом массива (делая "с"это то, что пост, который вы цитируете, подразумевается под" побочными эффектами ", я думаю), тогда как вы используете map, когда хотите копировать и преобразовывать каждый элемент массива (без изменения оригинала).
Поскольку и map, и forEach вызывают функцию для каждого элемента в массиве, и эта функция определяется пользователем, вы почти ничего не можете сделать с одним, а с другим - нет.Можно, хотя и некрасиво, использовать map, чтобы изменить массив на месте и / или сделать что-то с элементами массива:
var a = [{ val: 1 }, { val: 2 }, { val: 3 }];
a.map(function(el) {
el.val++; // modify element in-place
alert(el.val); // do something with each element
});
// a now contains [{ val: 2 }, { val: 3 }, { val: 4 }]
, но гораздо чище и более очевидно, что вы намерены использовать forEach:
var a = [{ val: 1 }, { val: 2 }, { val: 3 }];
a.forEach(function(el) {
el.val++;
alert(el.val);
});
Особенно, если, как это обычно бывает в реальном мире, el является полезной для человека переменной:
cats.forEach(function(cat) {
cat.meow(); // nicer than cats[x].meow()
});
Таким же образом выможно легко использовать forEach для создания нового массива:
var a = [1,2,3],
b = [];
a.forEach(function(el) {
b.push(el+1);
});
// b is now [2,3,4], a is unchanged
, но лучше использовать map:
var a = [1,2,3],
b = a.map(function(el) {
return el+1;
});
Обратите внимание, что, поскольку map делаетновый массив, он, вероятно, подвергается как минимум некоторому снижению производительности / памяти, когда все, что вам нужно, это итерация, особенно для больших массивов - см. http://jsperf.com/map-foreach
Что касается того, почему вы хотите использовать эти функции, ониполезно в любое время, когда вам нужно выполнить манипуляции с массивами в javascript, что (даже если мы говорим только о javascript в среде браузера) довольно часто, почти каждый раз, когда вы обращаетесь к массиву, который вы не записываете вручнуюв вашем коде.Возможно, вы имеете дело с массивом элементов DOM на странице, или данными, извлеченными из запроса AJAX, или данными, введенными пользователем в форму.Один из распространенных примеров, с которыми я сталкиваюсь - это извлечение данных из внешнего API, где вы можете использовать map для преобразования данных в нужный вам формат, а затем использовать forEach для итерации по вашему новому массиву, чтобы отобразить его вваш пользователь.