Пропуск итерации в JavaScript forEach: решение условиями

Быстрый ответ

Для пропуска текущей итерации в цикле forEach используйте return. Он выполняет функцию аналогичную continue в других циклах. Вот пример:

const nums = [1, 2, 3, 4, 5];
nums.forEach(num => {
  if (num % 2 === 0) return; // Пропуск чётных чисел
  console.log(num); // Вывод в консоль только нечётных чисел: 1, 3, 5
});

При применении return, выполнение текущей итерации прекращается для четных чисел, и начинается следующая итерация.

Объяснение использования return в цикле forEach

В контексте forEach, return служит для выхода из текущей итерации. Если условие выполняется, return прерывает его и цикл продолжает исполнение с следующей итерации. Не требуется указывать после return значение true — return; будет достаточно для перехода к следующей итерации.

Альтернативные способы итерации

Использование for...of

Цикл for...of дает больше возможностей благодаря знакомым конструкциям break, continue и return с метками. Он станет тем самым гибким инструментом, если forEach покажется вам слишком ограничивающим.

Подробнее об этом расскажет наш спикер на видео

Применение Array.filter()

Отфильтровывайте массив перед обработкой его элементов с помощью Array.filter(). Это похоже на действия таможенника, отсеивающего то, что не прошло по условиям.

Использование Array.map()

Метод Array.map(), в сочетании с return, позволяет создать новый массив, трансформирующий только необходимые элементы, оставшиеся элемены не изменяются.

Визуализация

Представьте forEach как конвейер с коробками:

dataArray.forEach(box => {
    if (poorBoxCondition(box)) {
        return; // Эта коробка непригодна! Пропускаем её!
    }
    // Обрабатываем хорошие коробки
});

Визуализация итераций:

Коробки: [📦, 🔥, 📦, 🔥, 🔥, 📦]
Пропущены: --, 🔥, --, 🔥, 🔥, --

📦 – успешно обработанные коробки, 🔥 – пропущенные при их плохом состоянии.

Более плавное forEach при использовании лучших практик

Обработка ошибок в forEach

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

Внимательно относитесь к вложенным циклам forEach

Return внутри вложенного forEach не остановит выполнение внешнего цикла. Продумайте наперёд свой код, чтобы избежать неприятных ситуаций.

Важность производительности

forEach менее производителен, особенно при работе с большими данными, по сравнению с стандартным for или for...of. Эти структуры не создают новых функциональных областей видимости на каждую итерацию.

Полезные материалы

1. Array.prototype.forEach() – JavaScript | MDN – подробный разбор работы forEach() в JavaScript.
2. how to stop Javascript forEach? – Stack Overflow – обсуждения возможностей и ограничений forEach на различных платформах.
3. no-restricted-syntax – ESLint – Pluggable JavaScript Linter – советы по использованию конструкций в JavaScript-коде.
4. Short circuit Array.forEach like calling break – Stack Overflow – подсказки по имитации поведения break в forEach.
5. Iterables and iterators in ECMAScript 6 – детальное изучение итераторов ECMAScript 6 и их применения.
6. for...of – JavaScript | MDN – должное освещение for...of цикла.
7. Методы массивов – JavaScript.info – компактный и всеобъемлющий обзор методов массивов в JavaScript, включая forEach().