Метод .forEach ()

Первый метод итерации, который мы собираемся изучить, - это .forEach (). Удачно названный, .forEach () будет выполнять один и тот же код для каждого элемента массива.

Приведенный выше код выведет на консоль красиво отформатированный список продуктов. Давайте рассмотрим синтаксис вызова .forEach ().

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

Другой способ передать обратный вызов(callback) для .forEach () - использовать синтаксис стрелочной функции.

groceries.forEach(groceryItem => console.log(groceryItem));

Мы также можем заранее определить функцию, которая будет использоваться в качестве функции обратного вызова (callback-функции).

function printGrocery(element){
  console.log(element);
}

groceries.forEach(printGrocery);

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

Все три фрагмента кода делают одно и то же. В каждом методе итерации массива мы можем использовать любой из трех примеров для предоставления функции обратного вызова в качестве аргумента итератору. Полезно знать о различных способах передачи функций обратного вызова в качестве аргументов в итераторах, потому что у разработчиков разные стилистические предпочтения. Тем не менее, из-за широкого распространения ES6 мы будем использовать синтаксис стрелочных функций в последующих упражнениях.

Практика

1. Итерируйте по массиву fruits, чтобы записать, я хочу съесть плюс имя каждого фрукта на консоли. Например, я хочу съесть манго.

Вы можете использовать любую форму обратного вызова по своему усмотрению.

const fruits = ['манго', 'папайя', 'ананас', 'яблоко'];

Подсказка:

Используйте точечную нотацию для доступа к методу .forEach () в массиве и используйте набор круглых скобок для вызова метода.

[1, 2, 3, 4].forEach()

.forEach () принимает callback-функцию.

[1, 2, 3, 4].forEach(function(element){
  console.log(`Пишем ${element} в консоль!`)
})

Решение:

fruits.forEach(fruit => console.log(`Я хочу съесть  ${fruit}));