首頁(yè)技術(shù)文章正文

setTimeout怎么用？setTimeout與setInterval的區(qū)別

更新時(shí)間:2020年08月24日15時(shí)40分來(lái)源:傳智播客瀏覽次數(shù):

setTimeout定義和用法

setTimeout() 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式。

語(yǔ)法

setTimeout(code,millisec)

setTimeout()用法

setTimeout 方法接收兩個(gè)參數(shù)，第一個(gè)參數(shù)為回調(diào)函數(shù)函數(shù)或字符串，第二個(gè)參數(shù)為觸發(fā)時(shí)間(單位：毫秒)

setTimeout(code, milliseconds, param1, param2, ...)?
setTimeout(function, milliseconds, param1, param2, ...)

參數(shù)	描述
code	必需。要調(diào)用的函數(shù)后要執(zhí)行的 JavaScript 代碼串。
millisec	可選。執(zhí)行或調(diào)用 code/function 需要等待的時(shí)間，以毫秒計(jì)。默認(rèn)為 0。
param1, param2, ...	可選。傳給執(zhí)行函數(shù)的其他參數(shù)（IE9 及其更早版本不支持該參數(shù)）

setTimeout()實(shí)例演示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>等待3秒演示</title>
</head>
<body>
<h1> <font color=blue>等待3秒鐘示演示</font> </h1>
<script>
    setTimeout("alert('對(duì)不起, 三秒鐘已到')", 3000 )
</script>
</body>
</html>

打開上面代碼網(wǎng)頁(yè)，三秒后就會(huì)出現(xiàn)一個(gè) alert 對(duì)話盒，提示“對(duì)不起, 三秒鐘已到”。

settimeout

setInterval()定義和用法

setInterval() 方法可按照指定的周期(以毫秒計(jì))來(lái)調(diào)用函數(shù)或計(jì)算表達(dá)式。

setInterval() 方法會(huì)不停地調(diào)用函數(shù)，直到 clearInterval() 被調(diào)用或窗口被關(guān)閉。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的參數(shù)。

語(yǔ)法

setInterval(code,millisec[,"lang"])

參數(shù)	描述
code	必需。要調(diào)用的函數(shù)或要執(zhí)行的代碼串。
millisec	必須。周期性執(zhí)行或調(diào)用 code 之間的時(shí)間間隔，以毫秒計(jì)。

代碼演示：

//實(shí)時(shí)刷新時(shí)間單位為毫秒
setInterval('refreshQuery()',8000); 
/* 刷新查詢 */
function refreshQuery(){
    $("#mainTable").datagrid('reload',null);
}

盡量不要用setInterval()

原因如下：

(1)setInterval()無(wú)視代碼錯(cuò)誤

setInterval有個(gè)討厭的習(xí)慣，即對(duì)自己調(diào)用的代碼是否報(bào)錯(cuò)這件事漠不關(guān)心。換句話說，如果setInterval執(zhí)行的代碼由于某種原因出了錯(cuò)，它還會(huì)持續(xù)不斷(不管不顧)地調(diào)用該代碼。

(2)setInterval無(wú)視網(wǎng)絡(luò)延遲

假設(shè)你每隔一段時(shí)間就通過Ajax輪詢一次服務(wù)器，看看有沒有新數(shù)據(jù)(注意：如果你真的這么做了，那恐怕你做錯(cuò)了;建議使用“補(bǔ)償性輪詢”(backoff polling))。而由于某些原因(服務(wù)器過載、臨時(shí)斷網(wǎng)、流量劇增、用戶帶寬受限，等等)，你的請(qǐng)求要花的時(shí)間遠(yuǎn)比你想象的要長(zhǎng)。但setInterval不在乎。它仍然會(huì)按定時(shí)持續(xù)不斷地觸發(fā)請(qǐng)求，最終你的客戶端網(wǎng)絡(luò)隊(duì)列會(huì)塞滿Ajax調(diào)用。

(3)setInterval不保證執(zhí)行

與setTimeout不同，你并不能保證到了時(shí)間間隔，代碼就準(zhǔn)能執(zhí)行。如果你調(diào)用的函數(shù)需要花很長(zhǎng)時(shí)間才能完成，那某些調(diào)用會(huì)被直接忽略。