Таймауты в javascript, описание методов setInterval и setTimeout с примерами

setTimeout

Данный метод выполняет код(или функцию), переданный(ую) в первом аргументе, асинхронно, с задержкой в delay. setTimeout выполняет код только один раз.

timeout_id = window.setTimeout(func|code, delay)

• func|code - функция или строка кода для выполнения
• delay - задержка в миллисекундах, т.е 1000 это 1 секунда
• timeout_id - идентификатор таймаута; используя clearTimeout можно отменить выполнение setTimeout (clearTimeout(timeout_id))

javascript

var timer = 10;

(function countdown(secs) {
  console.log(secs--);
  if (secs == 0) {
    console.log("done")
    }
  else {
    setTimeout(countdown.bind(null, secs), 100);
    }
})(timer);

/*
10
9
8
7
6
5
4
3
2
1
done
*/


/* аналог setInterval, но с использованием  setTimeout */
var timeCount = 1;
var timer = setTimeout
(
    function run(){
        console.log(timeCount++);
        timer = setTimeout(run,700);
    },
    700
)
/*
1
2
3
4
5
6
7
8
9
10
11
............*/

setInterval

setInterval выполняет код много раз, через равные промежутки времени, пока не будет остановлен при помощи clearInterval.

intervalID = window.setInterval(func|code, delay)

• func|code - функция или строка кода для выполнения
• delay - интервал в миллисекундах, т.е 1000 это 1 секунда
• intervalID - идентификатор интервала; используя clearInterval можно отменить выполнение setInterval (clearInterval(intervalID))

javascript

var varCounter = 0;
var varName = function(){
     if(varCounter <= 10) {
          varCounter++;
          /* your code goes here */
          console.log(varCounter);
     } else {
          clearInterval(varName);
     }
};

$(document).ready(function(){
     setInterval(varName, 100);
});

/*
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
*/