Отсрочка вызова функции в jQuery: использование rotate()

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

Для реализации задержки выполнения функции на указанный промежуток времени следует использовать функцию setTimeout:

setTimeout(() => {
  // Код будет выполнен с задержкой в 5 секунд
}, 5000);

Таким образом, указанная функция выполнится через 5 секунд, поскольку задержка указывается в миллисекундах (5000 мс = 5 с).

Отложенный вызов функции с параметрами

Если требуется отложить вызов функции с передачей параметров, следует использовать обёртку из анонимной функции или стрелочной функции:

function greetings(message) {
  console.log(`${message}, вы ожидались немного позже!`);
}

// Отложенный вызов с анонимной функцией
setTimeout(function() {
  greetings('Привет, мир');
}, 5000);

// Отложенный вызов со стрелочной функцией
setTimeout(() => greetings('Привет, коллега'), 5000);

Функция выполнится с заданными параметрами после указанного промежутка времени.

Управление контекстом в отложенных функциях

В JavaScript контекст исполнения this может изменяться. Для правильного сохранения контекста при отложенном вызове функции используйте метод bind:

const myObject = {
  name: 'Элеонора',
  perform() {
    console.log(`Время действовать, ${this.name}!`);
  }
};

setTimeout(myObject.perform.bind(myObject), 5000);

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

Отложим сейчас, повторим позже: setInterval

Для выполнения функции через равные интервалы времени применяйте setInterval:

setInterval(() => {
  // Функция будет вызываться каждые 5 секунд
}, 5000);

Чтобы прекратить периодический вызов функции, вызовите clearInterval:

const intervalId = setInterval(() => {}, 5000);

// Если нужно остановить периодический вызов
clearInterval(intervalId);

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

function initiateLaunch() {
    console.log("🚀 На максимальной тяге, взлетаем!!");
}

console.log("Контрольный центр: Подготовка к старту, T-5 секунд...");
setTimeout(initiateLaunch, 5000);  // 🕒 Подождем ещё немного, хорошо?

Вот как выглядит драматичный обратный отсчет:

Бортовой журнал: T-5... 🕒🔴
                 T-4... 🕒🔴
                 T-3... 🕒🔴
                 T-2... 🕒🔴
                 T-1... 🕒🔴
Старт:           🚀🟢 ... Мы на орбите!

Контрольный центр позаботится о том, чтобы двигатели запустились точно вовремя.

Плагин таймеров jQuery для расширенного управления

Для пользователей jQuery доступен плагин jQuery timers, облегчающий работу с таймерами. Он предлагает методы oneTime для однократной задержки и everyTime для задержки с повторением.

Пример использования однократной задержки:

$(document).oneTime(5000, () => {
  // Задержка в 5 секунд под контролем jQuery!
});

Для работы с регулярными интервалами:

$(document).everyTime(5000, () => {
  // Наш код выполняется каждые 5 секунд, словно с помощью магии!
});

А когда настанет время остановить выполнение:

// Время остановиться...
$(document).stopTime();

Плагин таймеров jQuery – это отличный инструмент для управления задержками и таймерами.

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

1. Функция setTimeout() – Веб API | MDN — Подробное описание работы с функцией setTimeout на MDN.
2. Таймеры в JavaScript — Введение в работу с таймерами в JavaScript с иллюстративными примерами.
3. Планирование: setTimeout и setInterval — Детальное руководство по использованию setTimeout и setInterval.
4. javascript – Как передать параметр функции обратного вызова setTimeout()? – Stack Overflow — Дискуссия о работе с параметрами функций при использовании setTimeout.
5. Замыкания – JavaScript | MDN — Важная информация о работе с замыканиями при использовании setTimeout в циклах.
6. Цикл событий – JavaScript | MDN — Основы работы с асинхронными операциями в JavaScript, включая setTimeout.
7. Promise – JavaScript | MDN — Обзор реализации асинхронного кода через промисы, включая применение setTimeout.