Методы массива JavaScript: .forEach — функциональный цикл for of
Встретиться Array.prototype.forEach()
.
Его цель — выполнить код, который вы ему предоставляете, для каждого элемента массива: по сути, петля.
Вот его определение:
Давайте объясним это ниже. 😉
forEach
принимает до двух параметров:
- в
callback
функция, которая выполняется над каждым элементом массива - в
thisArg
(необязательно), который изменяет значениеthis
внутри функции обратного вызова
А теперь подробнее о каждом. 👇
1) callback
функция
Метод, вызываемый для каждого элемента массива. Он принимает до трех параметров:
- currentValue: текущий элемент массива,
🍎
на первой итерации - index (необязательно): индекс текущего элемента,
0
на первой итерации - массив (необязательно): весь массив,
same
на всех итерациях
index
Параметр
index
параметр является необязательным. Это удобно, когда логика зависит от позиции элемента в массиве.
array
Параметр
Последний параметр array
. Это значение всего массива в начале выполнения метода обратного вызова.
Удобный : Это полезно, когда у вас есть общий метод, который вы передаете forEach
который требует доступа к массиву. Метод является универсальным, вы не можете заранее знать массив, для которого он будет вызываться. Это также означает, что вы не можете полагаться на закрытие, поскольку оно неизвестно.
Таким образом array
параметр в этом случае ваш Только возможность получить доступ к текущему массиву.
См. этот ответ Stackoverflow Ответить из реднеб для получения дополнительной информации.
2) thisArg
Параметр
Отменяет this
значение ключевого слова внутри callback
функция.
По умолчанию this
будет ссылаться на объект окна, и он будет переопределен значением, которое вы ему передадите.
Обычно я использую его, когда хочу применить побочный эффект к какому-то объекту или другому массиву. (Я стараюсь избегать побочных эффектов, насколько это возможно.)
Пример
В этом случае у нас есть список смайликов и соответствующий список имён. Мы хотим создать объект, ключом которого будет имя, а значением — эмодзи.
Два массива сортируются одинаково: при любом заданном индексе элементы из обоих массивов соответствуют друг другу.
Обратите внимание, что fruitMap
создается перед вызовом forEach на fruitEmojis
. И мы обновляем объект во время выполнения addKeyPairToFruitMap
.
Перед использованием forEach
методов для массивов вот некоторая информация, которую стоит знать.
1) Возврат undefined
таким образом, НЕ можно связать
forEach
метод массива всегда возвращает undefined
таким образом это НЕТ цепной. Это означает, что в цепочка вызововего можно разместить только на конец.
2) Функция обратного вызова может изменить исходный массив
Мы можем добавлять/удалять/обновлять элементы из массива внутри функции обратного вызова.
Добавление
Добавление делает НЕТ влияют на элементы для вызова: обрабатываются только элементы, изначально присутствующие.
Но после казни мы видим, что она была затронута.
Удаление
Удаление ДЕЛАЕТ влияет на количество элементов для вызова. Если следующий запланированный элемент будет удален, он не будет обработан.
Модификация
Модификация ДЕЛАЕТ влияет на предметы сами себя за звонок, но не в счет. Если мы изменим следующий запланированный элемент, эта модификация будет доступна, когда она затем будет обработана.
Обратите внимание, что четвертый элемент связан с этим оператором, следующим оператором, который добавляет элемент в массив при последнем выполнении: fruitEmojis[index + 1] = "AAAAAARH!";
.
3) Не может быть остановлен
Вы не можете остановить выполнение или «разорвать цикл» при вызове метода forEach.
Если вы пытаетесь остановить выполнение, вам, вероятно, следует использовать другой метод массива (например, найти, отфильтровать, уменьшить, некоторые, включить) или использовать для цикла вместо.
Я надеюсь, что эта статья о forEach
метод принес вам ценность. 🙂 Это будет часть серии статей о массивах JavaScript, так что следите за новостями! 🎉
А пока удачного кодирования! 😎