setTimeout 操作順序 clearTimeout

setTimeout

• 等待指定的毫秒數後執行一個函式。
• 用於延遲函式的執行。

語法： setTimeout(function, milliseconds) 或 window.setTimeout(function, milliseconds)

示例： 此示例在 1 秒後向控制檯輸出 hello。第二個引數以毫秒為單位，因此 1000 = 1 秒，250 = 0.25 秒等。

setTimeout(function() {
    console.log('hello');
}, 1000);

setTimeout 的問題

如果你在 for 迴圈中使用 setTimeout 方法 ：

for (i = 0; i < 3; ++i) {
  setTimeout(function(){
    console.log(i);
  }, 500);
}

這將輸出值 3 three 次，這是不正確的。

解決此問題的方法：

for (i = 0; i < 3; ++i) {
  setTimeout(function(j){
    console.log(i);
  }(i), 1000);
}

它將輸出值 0，1，2。在這裡，我們將 i 作為引數傳遞給函式（j）。

操作順序

此外，由於 Javascript 是單執行緒並使用全域性事件迴圈這一事實，setTimeout 可用於通過呼叫 setTimeout 以零延遲將項新增到執行佇列的末尾。例如：

setTimeout(function() {
    console.log('world');
}, 0);

console.log('hello');

實際輸出：

hello
world

此外，此處零毫秒並不意味著 setTimeout 內的函式將立即執行。根據執行佇列中剩餘的要執行的專案，需要稍微多一點。這個只是推到佇列的末尾。

取消超時

clearTimeout()： 停止執行 setTimeout() 中指定的函式

語法： clearTimeout(timeoutVariable) 或 window.clearTimeout（timeoutVariable）

示例：

var timeout = setTimeout(function() {
    console.log('hello');
}, 1000);

clearTimeout(timeout); // The timeout will no longer be executed