Таймер повторяющийся setInterval и единожды setTimeout в java script

Периодически в коде требуется использовать таймеры, которые выполняли бы определенные функции через какое-то время или только один раз. Данную проблему решают функции setInterval и setTimeout в java script.

setInterval - таймер, позволяет периодически выполнять одни и те же действия заданные в функции. Пример:

setInterval(function() {
alert('Приветик');
}, 5000);

Данный пример запустит alert-собщение через 5 сек. и повторит данное действие бесконечное количество раз с интервалом в 5 сек.

С помощью этого таймера можно считать секунды, выполнять анимацию и многое другое. Часто периодических действий для таймер достаточно много. Поэтому запуск действий можно перенести в заранее заданную функцию. Пример:

function show() { alert('Приветик!'); }
setInterval(function() { show(); }, 2000);

setTimeout - это таймер, который выполняется скриптом единожды с временем задержки, которое указано как и в setInterval. Пример:

setTimeout(function() { alert('Привет'); }, 2000);

Сообщение появится через 2 сек. после запуска скрипта, затем таймер больше не будет срабатывать.

Если вам нужно остановить запущенный таймер, то сначала присвойте ему идентификатор, а затем используйте функцию clearTimeout. Пример:

var id = setInterval(function() { alert('Еда');
clearTimeout(id); }, 5000);
alert(id);

Здесь переменная id - идентификатор таймера в виде числа. После принудительного завершения работы, его номер все равно сохранится в id. В этом примере сначала высветится идентификатор таймера, а через 5 сек. слово Еда, после чего сработает функция clearTimeout в которой уже будет прописан id таймера, который надо закрыть. Если бы ее не было, то таймер срабатывал каждые 5 секунд.

Умный (рекурсивный) setTimeout

Позволяет менять время таймера в зависимости от каких-либо условий, событий.

var timers = setTimeout(function ticks() {
alert( "Сработал!" );
timers = setTimeout(ticks, 2000);
}, 5000);

В этом примере мы меняем время срабатывания таймера на 2 сек.