Javascript forEach: как перебирать массив в Javascript

Метод JavaScript forEach () вызывается для объекта массива, и ему передается функция, которая вызывается для каждого элемента в массиве. Его можно использовать только в массивах, картах и ​​наборах.

Массив Javascript forEach ()

Массив Javascript forEach ( ) — встроенная функция, которая выполняет предоставленную функцию один раз для каждого элемента массива. Метод массива forEach () используется для перебора каждого элемента в массиве. При использовании forEach мы должны указать функцию обратного вызова. Эта функция обратного вызова будет выполняться для каждого элемента в массиве.

Функция обратного вызова также может принимать второй параметр индекса, если вам нужно ссылаться на индекс текущего элемента в массиве.

Синтаксис функции forEach Javascript следующий.

 array.forEach (function (currentValue, index, arr), thisValue) 

Параметры

currentValue — это текущий элемент в массиве, который выполняет итерацию прямо сейчас.

index — необязательный параметр, который является индексом текущего элемента массива.

arr — это необязательный параметр, который представляет собой объект массива, которому принадлежит текущий элемент.

thisValue — необязательный параметр, представляющий собой значение, передаваемое функции, которая будет использоваться в качестве ее значения «this».

Пример Array forEach ()

Функция Array.forEach () вызывает предоставленную функцию один раз для каждого элемента массива.

Предоставленная функция может выполнять любую операцию с элементами данного массива.

Давайте создадим папку и внутри нее создадим файл с именем app.js и добавим следующий код.

//app.jsvar arr = [1, 2, 3, 4, 5]; var newArray = []; arr.forEach (function (item) {newArray.push (item + 21);}); console.log (newArray  ); 

В приведенном выше примере мы используем функцию forEach, чтобы добавить 21 к каждому элементу массива. Итак, вновь созданный элемент выглядит так.

Мы можем напишите указанную выше функцию в стиле ES6.

//app.jslet arr = [1, 2, 3, 4, 5]; let newArray = []; arr.forEach (item =>  newArray.push (item + 21)); console.log (newArray); 

forEach () выполняет обратный вызов выполнять один раз для каждого элемента массива; в отличие от map () или reduce (), он всегда возвращает значение undefined и не объединяется в цепочку. Таким образом, мы можем использовать для выполнения в конце цепочки.

Доступ к индексу массива в методе forEach ()

Мы можем получить доступ к индексу внутри функции следующим образом.

//app.jslet arr = [1, 2, 3, 4, 5]; let newArray = []; arr.forEach ((item,  i) => консоль. log (i)); 

Теперь результат будет таким.

Нет другого способа прервать цикл forEach, кроме как выбросить исключение. Если вам нужно такое поведение для вашего кода, тогда метод forEach здесь не подходит. Вы можете использовать его здесь для цикла for ().

Если массив изменяется во время итерации

Давайте рассмотрим сценарий, в котором мы изменяем массив, который проходит итерацию, и тогда он может пропустить другие значения. См. Следующий пример.

//app.jslet arr = [1, 2, 3, 4, 5]; arr.forEach (item => {if (item == 3) {arr  .shift ();} console.log (item);}); 

В приведенном выше примере, если условие выполняется, следующий элемент массива пропускается. Итак, когда item = 3, значение 4 пропускается и сразу переходит к 5. Это означает, что мы изменили массив, используя нашу логику, и пропустили один элемент, что является нарушением функции forEach, поскольку она всегда выполняется для каждого элемента. массива.

Итерация (ключи, значения) в Javascript

Если мы хотим повторить итерацию пары ключ-значение в javascript, то цикл forEach нам не поможет. Вместо этого мы можем использовать Javascript for… in loop. См. Следующий пример.

//app.jslet strangerThings = [{name: 'Dustin', age: 13}, {name: 'Mike', age: 12}, {name: '  Одиннадцать ', возраст: 11}]; for (имя const в strangerThings) {if (strangerThings.hasOwnProperty (имя)) {console.log (strangerThings [имя]);  }} 

См. следующий результат.

 ➜ es git: (master) ✗ node app {name: 'Dustin', age: 13} {name: '  Майк, возраст: 12} {name: 'eleven', age: 11} ➜ es git: (master) ✗ 

Как разорвать цикл forEach в Javascript

Вы не можете выйти из функции forEach. Вместо этого вы должны использовать обычный цикл for.

Совместимость

Этот метод является расширением JavaScript стандарта ECMA-262; как таковой, он может отсутствовать в других реализациях стандарта. Чтобы он заработал, вам нужно добавить следующий код вверху вашего скрипта.

 if (! Array.prototype.forEach) {Array.prototype.forEach = function (fun/*,  thisp */) {var len = this.length;  if (typeof fun! = "функция") throw new TypeError ();  var thisp = arguments [1];  for (var i = 0; i  
  Javascript forEach () и Javascript push ()  
 
 Давайте скопируем все значения из одного массива в другой  массив с использованием функции Javascript foreach и функции Javascript push (). 
 
//app.jsconst elements = [11, 21, 46]; const copy = []; elements.forEach (function (element  ) {copy.push (element);}); console.log (copy); 
 См. вывод. 
 ➜ es git: (master) ✗ node  app [11, 21, 46] ➜ es git: (master) ✗ 
 В этом примере функция  forEach ()  добавляет каждый элемент в новый массив  . 
  Разница между forEach () и for in loop  
 Javascript forEach () - это метод массива, который мы можем использовать для  выполнить функцию для каждого элемента в массиве.  Javascript for in loop используется для перебора перечислимых свойств объектов.  
 Каждое свойство в объекте будет иметь значение Enumerable - если для этого значения установлено значение  true , тогда свойство будет Enumerable. 
 Наконец, пример функции Javascript Array forEach () завершен. 
  Рекомендуемые сообщения  
 Javascript array map () 
 Javascript array filter () 
 Javascript array reverse () 
 Javascript array reduce () 
 Javascript  массив включает ()