JavaScript 中的計時器

1. 在 JavaScript 中使用 setTimeout() 建立一個計時器
2. 在 JavaScript 中使用 setInterval() 建立一個計時器

JavaScript 提供了兩個定時器函式來執行非阻塞程式碼。JavaScript 提供了函式 setTimeout() 和 setInterval()，它們在特定時間間隔後執行指定的表示式或函式。

在今天的帖子中，我們將瞭解有關 JavaScript 計時器的更多資訊。

在 JavaScript 中使用 setTimeout() 建立一個計時器

這是 JavaScript 提供的非同步函式，它在計時器到期後執行特定的函式或程式碼段。各種原因會導致超時延遲，例如巢狀超時、非活動標籤頁中的超時、跟蹤指令碼的限制以及頁面載入期間的超時延遲。

JavaScript 中 setTimeout() 的語法

setTimeout(function [, delay, arg1, arg2, ...]);
setTimeout(code[, delay]);

引數

• function：這是一個強制性引數。它指定應該在時間過去後執行的函式。
• code：這是一個強制性引數。如果使用者沒有傳遞函式，使用者可以傳遞一個字串，作為函式的替代。
• 延遲：這是一個可選引數。在執行指定的程式碼或函式之前，此引數接受數值作為計時器（以毫秒為單位）。如果沒有傳遞任何值，則預設值為 0，這會導致立即執行。
• arg1, ..., argN：這是一個可選引數。如果傳遞函式，則可以將函式的值作為附加引數傳遞。

返回值

這個 setTimeout() 方法返回一個正的 timeoutID，它有助於識別計時器。該值可用於 clearTimeout()。

示例程式碼：

<button onclick="setTimeoutFunction()">Try set Timeout</button>

function addFn(a, b) {
  console.log(a + b);
  return a + b;
}

function setTimeoutFunction() {
  setTimeout(addFn, 5000, 5, 10);
}

輸出：

15

在 JavaScript 中使用 setInterval() 建立一個計時器

setInterval() 方法由 JavaScript 提供。該方法在 worker 和 window 介面上提供。它重複呼叫一個函式或執行一段程式碼。此程式碼在每次呼叫之間的固定時間延遲內執行。

setInterval() 和 setTimeout() 函式之間的唯一區別是 setInterval() 重複呼叫函式，每次呼叫之間都有延遲，而 setTimeout() 在延遲後執行函式。

JavaScript 中 setTimeout() 的語法

setInterval(function [, delay, arg1, arg2, ...]);

引數

• function：這是一個強制性引數。它指定應該在時間過去後執行的函式。
• code：這是一個強制性引數。如果使用者沒有傳遞函式，使用者可以傳遞一個字串替代函式。
• 延遲：這是一個可選引數。此引數接受在執行指定的程式碼或函式之前用作計時器的數值（以毫秒為單位）。如果沒有傳遞任何值，0 是預設值，這會導致立即執行。
• arg1, ..., argN：這是一個可選引數。如果傳遞函式，則可以將函式的值作為附加引數傳遞。

返回值

這個 setInterval() 方法返回一個正的 intervalID，它有助於識別計時器。該值可用於 clearInterval()。

示例程式碼：

<button onclick="setIntervalFunction()">Try set Interval</button>

function addFn(a, b) {
  console.log(a + b);
  return a + b;
}

function setIntervalFunction() {
  setInterval(addFn, 5000, 5, 10);
}

輸出：

15