Періодичні виконання

setTimeout (nameFunction, 1000) - викликає указанную функуию один раз через 1000мс

const timerId = setTimeout(callback, delay, arg1, arg2, ...);

• callback — функція, виклик якої необхідно запланувати
• delay — час у мілісекундах, через який callback-функція буде викликана один раз
• arg1, arg2 тощо) не обов’язкові і будуть передані callback функції під час виклику.

Результатом виклику setTimout() буде цифровий ідентифікатор створеного таймера, який потім може бути використаним для його подальшого скасування.

const button = document.querySelector("button");

const onClick = () => {
  const timerId = setTimeout(() => {
    console.log("I love async JS!");
  }, 2000);

  console.log(timerId);
};

button.addEventListener("click", onClick);

clearTimeout(id) - приймає ідентифікатор таймера та “очищає його”, тобто видаляє реєстрацію відкладеного виклику функції з черги.

const greet = () => {
  console.log("Hello!");
};

const timerId = setTimeout(greet, 3000);

clearTimeout(timerId);

setInterval() — це простий спосіб повторення коду знову і знову з певним інтервалом.

const intervalId = setInterval(callback, delay, arg1, arg2, ...);

const startBtn = document.querySelector(".js-start");

startBtn.addEventListener("click", () => {
  const intervalId = setInterval(() => {
    console.log(`Interval ID: ${intervalId}, ${Math.random()}`);
  }, 1000);
});

clearInterval(id) — приймає ідентифікатор інтервалу та очищає його, тобто видаляє виклики, зареєстровані переданим інтервалом з асинхронної черги.

const greet = () => {
  console.log("Hello!");
};

const intervalId = setInterval(greet, 3000);

clearInterval(intervalId);