setTimeout

定時器

JavaScript提供定時執(zhí)行代碼的功能,叫做定時器(timer),主要由setTimeout()和setInterval()這兩個函數(shù)來完成。兩者都是全局屬性

一、setTimeout()

setTimeout函數(shù)用來指定某個函數(shù)或某段代碼,在多少毫秒之后執(zhí)行幼衰。它返回一個整數(shù),表示定時器的編號缀雳,以后可以用來取消這個定時器渡嚣。

語法:var tinmerId = setTimeout(func|code,delay)
第一個參數(shù)是將要執(zhí)行的函數(shù)或者一段代碼,第二個參數(shù)是推遲執(zhí)行的毫秒數(shù)肥印。

var timer = setTimeout(function(){console.log('hello')},1000)//返回一個編號(19)识椰,一秒后輸出“hello”
setTimeout(function(){console.log('hello')},1000)//返回一個編號(20),一秒后輸出“hello”
var timer = setTimeout(function(){console.log('hello')},10000)//返回一個編號(21)深碱,10秒后輸出“hello”
clearTimeout(timer)//可以在還沒有輸出時腹鹉,停止執(zhí)行
clearTimeout(22)//可以直接清除編號

立即返回的是延遲的編號,下次可以直接調(diào)用編號

setInterval()

與setTimeout用法完全一致敷硅,setInterval指定某個任務(wù)每間隔一段時間執(zhí)行一次功咒,是無限次的定時執(zhí)行愉阎。

var timer = setInterval(function(){
    console.log(new Date())
},1000)
//每隔一秒,輸出當(dāng)前時間
clearInterval(timer)//清除

運行機(jī)制

將指定代碼移出本次執(zhí)行 力奋,等到下一輪Event Loop時榜旦,再檢查 是否到了指定時間。如果到了景殷,就政治性對應(yīng)的代碼溅呢;如果沒到,就等下一輪Event Loop時重新判斷 滨彻。

瀏覽器一般有最小時間間隔(4-10毫秒)藕届,設(shè)置的時間是盡可能的貼近挪蹭,而不是嚴(yán)格的執(zhí)行時間亭饵。

異步和回調(diào)

函數(shù)節(jié)流

設(shè)置一個定時器,先判斷是否有定時器梁厉,沒有的話就設(shè)置一個辜羊,有的話就清除上一次的再重新設(shè)置一個定時器

var timer 

function hiFrequency() {
    if(timer) {
        clearTimerout(timer)
    } //第一次timer沒有值,不執(zhí)行词顾;如果不足1秒又執(zhí)行了一次八秃,就清除timer的值
    timer = setTimerout(function(){
        console.log('hello world')
    },1000) //一秒后輸出,不足1秒再次執(zhí)行就會先運行上面代碼清除肉盹,只輸出最后一次超過1秒沒有繼續(xù)執(zhí)行的代碼
hiFrequency()
hiFrequency()
hiFrequency()
}

優(yōu)化上面代碼:

function throttle(fn,delay){
    var timer = null
    return function(){  //返回一個函數(shù)
        clearTimeout(timer)
        timer = setTimeout(function(){
            fn(arguments)
        },delay)
    }
}
function fn(){
    console.log('hello')    
}
var fn2 = throttle(fn,1000)//執(zhí)行的是返回的函數(shù)
fn2()
fn2()
fn2()
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末昔驱,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子上忍,更是在濱河造成了極大的恐慌骤肛,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,482評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件窍蓝,死亡現(xiàn)場離奇詭異腋颠,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)吓笙,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,377評論 2 382
  • 文/潘曉璐 我一進(jìn)店門淑玫,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人面睛,你說我怎么就攤上這事絮蒿。” “怎么了叁鉴?”我有些...
    開封第一講書人閱讀 152,762評論 0 342
  • 文/不壞的土叔 我叫張陵歌径,是天一觀的道長。 經(jīng)常有香客問我亲茅,道長回铛,這世上最難降的妖魔是什么狗准? 我笑而不...
    開封第一講書人閱讀 55,273評論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮茵肃,結(jié)果婚禮上腔长,老公的妹妹穿的比我還像新娘。我一直安慰自己验残,他們只是感情好捞附,可當(dāng)我...
    茶點故事閱讀 64,289評論 5 373
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著您没,像睡著了一般鸟召。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上氨鹏,一...
    開封第一講書人閱讀 49,046評論 1 285
  • 那天欧募,我揣著相機(jī)與錄音,去河邊找鬼仆抵。 笑死跟继,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的镣丑。 我是一名探鬼主播舔糖,決...
    沈念sama閱讀 38,351評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼莺匠!你這毒婦竟也來了金吗?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,988評論 0 259
  • 序言:老撾萬榮一對情侶失蹤趣竣,失蹤者是張志新(化名)和其女友劉穎摇庙,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體期贫,經(jīng)...
    沈念sama閱讀 43,476評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡跟匆,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,948評論 2 324
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了通砍。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片玛臂。...
    茶點故事閱讀 38,064評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖封孙,靈堂內(nèi)的尸體忽然破棺而出迹冤,到底是詐尸還是另有隱情,我是刑警寧澤虎忌,帶...
    沈念sama閱讀 33,712評論 4 323
  • 正文 年R本政府宣布泡徙,位于F島的核電站,受9級特大地震影響膜蠢,放射性物質(zhì)發(fā)生泄漏堪藐。R本人自食惡果不足惜莉兰,卻給世界環(huán)境...
    茶點故事閱讀 39,261評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望礁竞。 院中可真熱鬧糖荒,春花似錦、人聲如沸模捂。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,264評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽狂男。三九已至综看,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間岖食,已是汗流浹背红碑。 一陣腳步聲響...
    開封第一講書人閱讀 31,486評論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留县耽,地道東北人句喷。 一個月前我還...
    沈念sama閱讀 45,511評論 2 354
  • 正文 我出身青樓镣典,卻偏偏與公主長得像兔毙,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子兄春,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 42,802評論 2 345

推薦閱讀更多精彩內(nèi)容