Работа с массивами — одна из самых рутинных задач в программировании. Безусловно, нет недостатка в методах, облегчающих навигацию по элементам и управление ими. forEach и map — два широко используемых метода массива, и они кажутся почти идентичными по своему назначению: перебирать и преобразовывать каждый элемент массива. Однако существуют различия в том, как они достигают этой цели, и понимание этих различий является ключом к пониманию того, какой метод лучше всего подходит для данной работы. Итак, давайте посмотрим, как работает каждый из этих методов.
.forEach()
Полное определение Array.prototype.forEach() в веб-документах MDN:
// Arrow function
forEach((element) => { … } )
forEach((element, index) => { … } )
forEach((element, index, array) => { … } )
// Callback function
forEach(callbackFn)
forEach(callbackFn, thisArg)
// Inline callback function
forEach(function(element) { … })
forEach(function(element, index) { … })
forEach(function(element, index, array){ … })
forEach(function(element, index, array) { … }, thisArg)```
Короче говоря, forEach() — это метод массива, который принимает предоставленную функцию и вызывает ее один раз для каждого элемента массива в порядке возрастания индекса. Предоставленная функция НЕ вызывается для неинициализированных или удаленных элементов. Например, forEach() применит предоставленную функцию к массиву[1,2,,3,4] только три раза.
Возвращаемое значение forEach() равно undefined. Это важно принять к сведению, так как это делает его несвязным. Типичный вариант использования — выполнение побочных эффектов либо само по себе, либо в конце цепочки методов.
Вопрос изменчивости несколько расплывчатый. forEach() сама по себе не изменяет исходный массив, который ее вызывает, однако предоставленная функция может изменить исходный массив. Изменение исходного массива может привести к непреднамеренным побочным эффектам и, как правило, не считается хорошей практикой в приложении, где несколько различных методов основаны на использовании значений исходного массива, и их следует использовать с большой осторожностью.
.map()
Полное определение Array.prototype.map() в веб-документах MDN:
// Arrow function
map((element) => { ... })
map((element, index) => { ... })
map((element, index, array) => { ... })
// Callback function
map(callbackFn)
map(callbackFn, thisArg)
// Inline callback function
map(function(element) { ... })
map(function(element, index) { ... })
map(function(element, index, array){ ... })
map(function(element, index, array) { ... }, thisArg)
Основное различие между map() и forEach() заключается в том, что map() создает и возвращает новый массив, элементы которого являются результатом применения предоставленной функции к каждому элементу вызывающего массива. Предоставленная функция вызывается для всех элементов, которым назначено значение, даже если значение равно undefined. Она всегда возвращает то же количество значений, что и в исходном массиве.
Вот краткое описание поведения обоих методов:
Итак, когда мы должны использовать forEach() против map()? Поскольку map() создает новый массив, если вам не нужно использовать возвращаемый массив или возвращаемое значение из предоставленной функции, используйте forEach().. Если вам нужен возвращаемый массив для назначения другому массиву или цепочке для других методов массива, используйте map(). Кроме того, forEach() более производительен, чем map(), с точки зрения операций в секунду (читайте об этом здесь), так что это еще одно соображение, особенно если вам не требуется возвращаемый массив и вы имеете дело с большими наборами данных.
Я надеюсь, что это краткое обсуждение сходств и различий между этими двумя методами работы с массивами поможет вам написать более эффективный код и избежать сообщений об ошибках из-за возвращаемого значения undefined для forEach().
Удачного кодирования!
