13,8 тыс подписчиков

Алгоритм JavaScript: Array.forEach()

14 сентября 202114 сен 2021

2 мин

Метод forEach() выполняет функцию обратного вызова для каждого элемента в массиве. Что это значит? Метод forEach вызывает функцию, находящуюся вне forEach и имеющую дело с итерацией для проверяемого массива. Присмотримся к тому, как это на самом деле происходит. 1 случай:

Здесь мы имеем дело с массивом flowers. Каждый элемент в массиве представляет собой строки с названиями цветов.

Напишем теперь функцию обратного вызова с аргументами по умолчанию each element (каждый элемент), index (индекс) и original array (исходный массив). С этой функцией можно делать что угодно. Мы регистрируем ее в журнале консоли. 2 случай:

ArrayName.forEach((eachEle, index, array) => console.log(eachEle))

Затем метод forEach выполнит функцию обратного вызова:

flowers.forEach(function callbackFunc(name, idx, arr){console.log(name, idx, arr)});

forEach: встроенная функция обратного вызова

Здесь происходит то же самое, что и в первом случае — метод forEach выполняет функцию обратного вызова, но только уже в одной строке.

3 случай:

flowers.forEach((name, idx, arr) => {
console.log(name, idx, arr)
});

forEach: стрелочная функция

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

Попрактикуемся с более сложными алгоритмами.

There are multiple flowers in the garden. Which flowers are there only two of in the garden?

В саду несколько цветков. Каких цветков в саду всего два?

Здесь у нас структура массива, состоящего из строк с названиями цветов. Перебираем массив, используя метод forEach. Для каждого названия цветка увеличиваем счетчик, если этот цветок существует в объекте count (пара «ключ-значение»). А если цветка нет, устанавливаем значение на 1. Затем отдельно от этой итерации проводим итерацию по созданному нами объекту и находим, каких цветков всего два.

Отметим, что объект этот — count и объявлен он вне итерации .forEach.

{
peony: 2,
rose: 3,
sunflower: 1,
linaria: 1
}

.forEach method only returns `undefined`

forEach не допускает объявления переменной внутри цикла. Также нельзя использовать оператор if и возвращать значение внутри метода forEach иначе, кроме как объявлять переменную вне итерации forEach и затем возвращать вне или проводить манипуляции с этими данными.

Посмотрите на следующий вопрос из StackOverflow и попробуйте найти ответ:

Здесь используют также цикл for или цикл for of.