Запропонувати правкуПокращити цю статтюДопрацюйте відповідь до «Що робить setInterval()?». Ваші зміни проходять модерацію перед публікацією.Потрібне підтвердженняКонтентЩо ви змінюєте🇺🇸EN🇺🇦UAПереглядЗаголовок (UA)Коротка відповідь (UA)**`setInterval()`** - вбудована функція JavaScript, яка запускає періодичний таймер, кожні `delay` мілісекунд додає вказаний колбек у чергу макротасок і продовжує робити це, доки не буде викликано `clearInterval()`. **Ключове:** `setInterval()` не гарантує, що колбек спрацює рівно через `delay` мс - якщо рушій зайнятий, запуск затримається.Показується над повною відповіддю для швидкого нагадування.Відповідь (UA)Зображення## Що робить `setInterval()` `setInterval()` - це вбудована функція JavaScript, яка: 1. запускає **періодичний таймер**, 2. кожні `delay` мілісекунд додає вказаний **колбек** до **черги макротасок**, 3. продовжує робити це **доти, доки не буде викликано** `clearInterval()`. --- ## Синтаксис ```javascript setInterval(callback, delay, ...args); ``` ### Параметри: - `callback` - функція, яку потрібно викликати повторно; - `delay` - інтервал між запусками у мілісекундах; - `...args` - додаткові аргументи, що передаються в колбек. --- ## Приклад ```javascript let count = 0; const id = setInterval(() => { count++; console.log(`Минуло ${count} секунд`); if (count === 5) { clearInterval(id); console.log('Таймер зупинено'); } }, 1000); ``` **Що станеться:** ```javascript Минуло 1 секунд Минуло 2 секунд Минуло 3 секунд Минуло 4 секунд Минуло 5 секунд Таймер зупинено ``` Щосекунди в чергу задач додається нова функція, яка виконується, коли стек порожній. --- ## Що повертає `setInterval()` Повертає **числовий ідентифікатор інтервалу (ID)** - той самий тип, що й у `setTimeout()`. Цей ID використовується, щоб **зупинити** таймер: ```javascript const intervalId = setInterval(() => console.log('tick'), 1000); // через 5 секунд зупиняємо setTimeout(() => clearInterval(intervalId), 5000); ``` --- ## Як це працює під капотом 1. `setInterval()` реєструє таймер у **зовнішньому API (Web API / Node Timer API)**. 2. Кожні `delay` мс Web API додає колбек у **чергу макротасок (Task Queue)**. 3. **Event Loop** виконує колбек, коли стек викликів порожній. 4. Цикл повторюється, доки не викликано `clearInterval()`. --- ## Важливо знати ### 1. Інтервал не дорівнює точному часу `setInterval` не гарантує, що колбек спрацює рівно через `delay` мс. Якщо рушій зайнятий (наприклад, виконується важкий код), запуск **затримається**. ```javascript setInterval(() => console.log('tick'), 1000); while (true) {} // сторінка "зависне", інтервали не виконаються ``` --- ### 2. Можливі накопичення викликів Якщо колбек займає більше часу, ніж сам інтервал, задачі будуть **накопичуватися** в черзі: ```javascript setInterval(() => { const start = Date.now(); while (Date.now() - start < 2000) {} // блокуємо потік на 2 сек console.log('Виклик'); }, 1000); ``` Інтервал 1 с, але виконання займає 2 с - колбеки будуть "тіснитися" в черзі й виконуватися один за одним, без пауз. --- ### 3. Можна передавати аргументи ```javascript setInterval((a, b) => console.log(a + b), 1000, 2, 3); // -> Щосекунди виведе 5 ``` --- ## Відмінність `setInterval()` від `setTimeout()` | Властивість | `setTimeout()` | `setInterval()` | |---|---|---| | Запускає | Один раз | Багаторазово | | Повторення | Ні | Так | | Повертає | ID таймера | ID інтервалу | | Скасування | `clearTimeout(id)` | `clearInterval(id)` | | Черга | Макротаски | Макротаски | | Використовується для | Відкладеного виконання | Задач, що повторюються |Для рев’юераПримітка для модератора (необов’язково)Бачить лише модератор. Прискорює рев’ю.