防抖和節(jié)流 講解

以下內(nèi)容是引用或者借鑒別人的蜗巧,自己只是做個筆記幕屹,方便學(xué)習(xí)级遭。理解錯誤的地方挫鸽,歡迎評論丢郊。如有侵權(quán)蚂夕,私聊我刪除婿牍,未經(jīng)允許等脂,不準(zhǔn)作為商業(yè)用途

防抖:在n秒內(nèi)撑蚌,連續(xù)觸發(fā)同一事件争涌,前面的都不執(zhí)行,只執(zhí)行最后一次方法

  • 思路:在n秒內(nèi)再次被觸發(fā)伟骨,則清除定時器燃异,讓它重新開始計時
/**
 * @desc 函數(shù)防抖
 * @param func 函數(shù)
 * @param wait 延遲執(zhí)行毫秒數(shù)
 * @param immediate true 表立即執(zhí)行回俐,false 表非立即執(zhí)行
 */
function debounce(func,wait=1000,immediate=false) {
    let timeout;
    return function () {
        let context = this;
        let args = arguments;
        if (timeout) clearTimeout(timeout);
        if (immediate) {
            var callNow = !timeout;
            timeout = setTimeout(() => {
                timeout = null;
            }, wait)
            if (callNow) func.apply(context, args)
        }
        else {
            timeout = setTimeout(function(){
                func.apply(context, args)
            }, wait);
        }
    }
}

節(jié)流:在n秒內(nèi)仅颇,連續(xù)觸發(fā)同一事件忘瓦,只執(zhí)行第一次方法,最后都不執(zhí)行

  • 思路:在n秒內(nèi)第一次觸發(fā)時枚抵,添加鎖機制汽摹,等到執(zhí)行了函數(shù)再釋放
function throttle(func, wait=1000) {
    let timeout;
    return function() {
        let context = this;
        let args = arguments;
        if (!timeout) {
            timeout = setTimeout(() => {
                timeout = null;
                func.apply(context, args)
            }, wait)
        }
    }
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末逼泣,一起剝皮案震驚了整個濱河市拉庶,隨后出現(xiàn)的幾起案子氏仗,更是在濱河造成了極大的恐慌夺鲜,老刑警劉巖皆尔,帶你破解...
    沈念sama閱讀 219,427評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異币励,居然都是意外死亡慷蠕,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,551評論 3 395
  • 文/潘曉璐 我一進店門食呻,熙熙樓的掌柜王于貴愁眉苦臉地迎上來流炕,“玉大人澎现,你說我怎么就攤上這事∶勘伲” “怎么了昔头?”我有些...
    開封第一講書人閱讀 165,747評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長影兽。 經(jīng)常有香客問我揭斧,道長,這世上最難降的妖魔是什么峻堰? 我笑而不...
    開封第一講書人閱讀 58,939評論 1 295
  • 正文 為了忘掉前任讹开,我火速辦了婚禮,結(jié)果婚禮上捐名,老公的妹妹穿的比我還像新娘旦万。我一直安慰自己,他們只是感情好镶蹋,可當(dāng)我...
    茶點故事閱讀 67,955評論 6 392
  • 文/花漫 我一把揭開白布成艘。 她就那樣靜靜地躺著,像睡著了一般贺归。 火紅的嫁衣襯著肌膚如雪淆两。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,737評論 1 305
  • 那天拂酣,我揣著相機與錄音秋冰,去河邊找鬼。 笑死婶熬,一個胖子當(dāng)著我的面吹牛剑勾,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播赵颅,決...
    沈念sama閱讀 40,448評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼虽另,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了饺谬?” 一聲冷哼從身側(cè)響起捂刺,我...
    開封第一講書人閱讀 39,352評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎商蕴,沒想到半個月后叠萍,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體芝发,經(jīng)...
    沈念sama閱讀 45,834評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡绪商,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,992評論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了辅鲸。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片格郁。...
    茶點故事閱讀 40,133評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出例书,到底是詐尸還是另有隱情锣尉,我是刑警寧澤,帶...
    沈念sama閱讀 35,815評論 5 346
  • 正文 年R本政府宣布决采,位于F島的核電站自沧,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏树瞭。R本人自食惡果不足惜拇厢,卻給世界環(huán)境...
    茶點故事閱讀 41,477評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望晒喷。 院中可真熱鬧孝偎,春花似錦、人聲如沸凉敲。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,022評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽爷抓。三九已至势决,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間蓝撇,已是汗流浹背徽龟。 一陣腳步聲響...
    開封第一講書人閱讀 33,147評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留唉地,地道東北人据悔。 一個月前我還...
    沈念sama閱讀 48,398評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像耘沼,于是被迫代替她去往敵國和親极颓。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,077評論 2 355