Понимание setTimout внутри цикла For в JavaScript

Метод setTimeout() вызывает функцию или через определенное время. Функция запускается один раз через интервал времени.

setTimeout в цикле For

Теперь давайте посмотрим, как setTimeout работает внутри цикла for.

Проблема: когда мы запускаем код, мы видим, что последнее значение i печатается каждый раз, когда 4.

Почему?Обратный вызов функции setTimeout не запускается до завершения выполнения цикла for. Когда цикл for завершит выполнение, значение равно 4.

Решение. Мы можем решить эту проблему тремя способами.

  1. Использование ключевого слова let

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

2. Установка setTimeout внутри функции вне цикла for

Вызовите метод setTimeout в других функциях, когда для триггера цикла

3. Использование IIFE (выражение немедленно вызываемой функции)

Мы можем использовать IIFE для создания новой области для каждого обратного вызова setTimout, не загрязняя глобальную область.

Подведение итогов

В этой статье мы узнали, как использовать setTimeout внутри For в javascript. Мы видели проблему, когда итерация setTimeout внутри цикла. Мы исправили эту проблему тремя способами.