update func
This commit is contained in:
69
docs/javascript/04-functions/08-setTimeout-setInterval.md
Normal file
69
docs/javascript/04-functions/08-setTimeout-setInterval.md
Normal file
@@ -0,0 +1,69 @@
|
||||
---
|
||||
sidebar_position: 8
|
||||
---
|
||||
|
||||
# Планирование: setTimeout и setInterval
|
||||
- Методы `setInterval(func, delay, ...args)` и `setTimeout(func, delay, ...args)` позволяют выполнять func регулярно или только один раз после задержки `delay`, заданной в мс.
|
||||
- Для отмены выполнения необходимо вызвать `clearInterval/clearTimeout` со значением, которое возвращают методы `setInterval/setTimeout`.
|
||||
- Вложенный вызов `setTimeout` является более гибкой альтернативой `setInterval`. Также он позволяет более точно задать интервал между выполнениями.
|
||||
- Планирование с нулевой задержкой `setTimeout(func,0)` или, что то же самое, `setTimeout(func)` используется для вызовов, которые должны быть исполнены как можно скорее, после завершения исполнения текущего кода.
|
||||
- Браузер ограничивает 4-мя мс минимальную задержку между пятью и более вложенными вызовами `setTimeout`, а также для `setInterval`, начиная с 5-го вызова.
|
||||
|
||||
Методы планирования не гарантируют точную задержку. Например, таймер в браузере может замедляться по многим причинам:
|
||||
- Перегружен процессор.
|
||||
- Вкладка браузера в фоновом режиме.
|
||||
- Работа ноутбука от аккумулятора.
|
||||
|
||||
Всё это может увеличивать минимальный интервал срабатывания таймера (и минимальную задержку) до 300 или даже 1000 мс в зависимости от браузера и настроек производительности ОС.
|
||||
|
||||
## setTimeout
|
||||
setTimeout позволяет вызвать функцию один раз через определённый интервал времени.
|
||||
|
||||
```js
|
||||
let timerId = setTimeout(func|code, [delay], [arg1], [arg2], ...);
|
||||
```
|
||||
💥 Передавайте функцию, но не запускайте её
|
||||
Разработчики иногда ошибаются, добавляя скобки () после функции. Это не работает, потому что `setTimeout` ожидает ссылку на функцию.
|
||||
|
||||
Вызов `setTimeout` возвращает «идентификатор таймера» `timerId`, который можно использовать для отмены дальнейшего выполнения.
|
||||
```js
|
||||
let timerId = setTimeout(...);
|
||||
clearTimeout(timerId);
|
||||
```
|
||||
## setInterval
|
||||
`setInterval` позволяет вызывать функцию регулярно, повторяя вызов через определённый интервал времени.
|
||||
Метод `setInterval` имеет такой же синтаксис как `setTimeout`
|
||||
|
||||
```js
|
||||
let timerId = setInterval(func|code, [delay], [arg1], [arg2], ...);
|
||||
```
|
||||
Чтобы остановить дальнейшее выполнение функции, необходимо вызвать clearInterval(timerId).
|
||||
|
||||
## Вложенный setTimeout
|
||||
Есть два способа запускать что-то регулярно. Один из них `setInterval`. Другим является вложенный `setTimeout`.
|
||||
|
||||
Вложенный `setTimeout` – более гибкий метод, чем `setInterval`. С его помощью последующий вызов может быть задан по-разному в зависимости от результатов предыдущего.
|
||||
|
||||
Например, необходимо написать сервис, который отправляет запрос для получения данных на сервер каждые 5 секунд, но если сервер перегружен, то необходимо увеличить интервал запросов до 10, 20, 40 секунд… Вот псевдокод:
|
||||
```js
|
||||
let delay = 5000;
|
||||
|
||||
let timerId = setTimeout(function request() {
|
||||
...отправить запрос...
|
||||
|
||||
if (ошибка запроса из-за перегрузки сервера) {
|
||||
// увеличить интервал для следующего запроса
|
||||
delay *= 2;
|
||||
}
|
||||
|
||||
timerId = setTimeout(request, delay);
|
||||
|
||||
}, delay);
|
||||
```
|
||||
***Вложенный `setTimeout` позволяет задать задержку между выполнениями более точно, чем `setInterval`.***
|
||||
|
||||
## setTimeout с нулевой задержкой
|
||||
Особый вариант использования: `setTimeout(func, 0)` или просто `setTimeout(func)`.
|
||||
Это планирует вызов `func` настолько быстро, насколько это возможно. Но планировщик будет вызывать функцию только после завершения выполнения текущего кода.
|
||||
|
||||
Так вызов функции будет запланирован сразу после выполнения текущего кода.
|
||||
Reference in New Issue
Block a user