H5前端開發(fā)社區(qū)專注更多編程教程和電子書天天在用錢在vue中，有兩套定時器，一套是瀏覽器API，window對象上的；另一套就是vue/nodejs封裝的，需要引入import { setInterval, clearInterval } from 'timers'建議使用window對象自帶的，因為不容易錯。 如果一不小心只引入一個，就怎么也清不掉了。import { setInterval } from 'timers' // 錯誤一定要在beforeDestroy中清除定時器。data () { return { timer: 0 }},//模塊初始化時打開定時器created () { this.timer = setInterval(() => { //do something //定時器的回調(diào)函數(shù)中需要注意 this 指向 }, 5000)},//銷毀前清除定時器beforeDestroy () { clearInterval(this.timer)}

js 定時器有以下兩個方法：

• setInterval() ：按照指定的周期(以毫秒計)來調(diào)用函數(shù)或計算表達(dá)式。方法會不停地調(diào)用函數(shù)，直到 clearInterval() ?被調(diào)用或窗口被關(guān)閉。

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

setInterval()

語法

setInterval(code,millisec,lang)

參數(shù) 描述

• code 必需。要調(diào)用的函數(shù)或要執(zhí)行的代碼串。

• millisec 必須。周期性執(zhí)行或調(diào)用 code 之間的時間間隔，以毫秒計。

• lang 可選。 JScript | VBScript | JavaScript

以下實例在每 1000 毫秒執(zhí)行 clock() 函數(shù)。實例中也包含了停止執(zhí)行的按鈕:

在需要重復(fù)發(fā)送請求或者某些效果的時候，一般都會想到使用setInterval，但是它的一些弊端，會給程序帶來很大的隱患

一、弊端

setInterval對自己調(diào)用的代碼是否報錯漠不關(guān)心。即使調(diào)用的代碼報錯了，它依然會持續(xù)的調(diào)用下去。

setInterval無視網(wǎng)絡(luò)延遲。在使用ajax輪詢服務(wù)器是否有新數(shù)據(jù)時，必定會有一些人會使用setInterval，然而無論網(wǎng)絡(luò)狀況如何，它都會去一遍又一遍的發(fā)送請求，如果網(wǎng)絡(luò)狀況不良，一個請求發(fā)出，還沒有返回結(jié)果，它會堅持不懈的繼續(xù)發(fā)送請求，最后導(dǎo)致的結(jié)果就是請求堆積。

setInterval并不定時。如果它調(diào)用的代碼執(zhí)行的時間小于定時的時間，它會跳過調(diào)用，這就導(dǎo)致無法按照你需要的執(zhí)行次數(shù)或無法得到你想要的結(jié)果。

二、解決方案使用setTimeout代替setInterval。 可以給setTimeout設(shè)置時間后，在最后調(diào)用自身。如果希望“勻速”觸發(fā)?？梢杂嬎愦a執(zhí)行時間，用希望的延遲減去上次執(zhí)行的時間。

注：有一種想法是將setInterval的延遲時間設(shè)置的長于上述的幾種時間，來達(dá)到絕對的均速調(diào)用。但事實上，js的計時器因為自身機制的原因，存在4ms–15ms的誤差。

setTimeout()語法

setTimeout(code,millisec,lang)

參數(shù) 描述

• code 必需。要調(diào)用的函數(shù)后要執(zhí)行的 JavaScript 代碼串。

• millisec 必需。在執(zhí)行代碼前需等待的毫秒數(shù)。

• lang 可選。腳本語言可以是：JScript | VBScript | JavaScript

如果想要在一個函數(shù)中啟用定時器 ?又想在另一個函數(shù)關(guān)閉這個函數(shù) 可以這樣做:

var timer1 = null;function start(){ if ( timer1 ) return; timer1 = setInterval("test()",200);}function end(){ if ( timer1 ) { clearInterval(timer1); timer1 = null; }}

注意事項: 這里的 timer1 相當(dāng)于setInterval 的 id, 執(zhí)行clearInterval(timer1)方法時, 就是傳入定時器 ID 進(jìn)行停止的。

作者：HelloVue
鏈接：https://juejin.cn/post/6917231784581136391
來源：掘金
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

●如何從初級程序員順利晉升到高級程序員？

●程序員接私活，怎樣防止做完不給錢？

●程序員的年終總結(jié)：阿姨，我不想努力了

●專訪阿里云 Serverless負(fù)責(zé)人：無服務(wù)器不會讓后端失業(yè)

*版權(quán)聲明：轉(zhuǎn)載文章和圖片均來自公開網(wǎng)絡(luò)，版權(quán)歸作者本人所有，推送文章除非無法確認(rèn)，我們都會注明作者和來源。如果出處有誤或侵犯到原作者權(quán)益，請與我們聯(lián)系刪除或授權(quán)事宜。

溫馨提示

返回上一級?回復(fù)?“前端”?,?"視頻"……等你要的資源的關(guān)鍵詞，即可得到內(nèi)部電子書和視頻，或參考關(guān)鍵詞回復(fù)功能這篇文章

長按關(guān)注

H5前端開發(fā)社區(qū)

你點的每個“在看”，我都認(rèn)真當(dāng)成了喜歡

總結(jié)

以上是生活随笔為你收集整理的的setinterval函数_Vue定时器与JS 定时器 setInterval() 和 setTimeout()的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。