摘要:節流閥觸發的事件以周期的形式去執行,而非實時。如滴水的水龍頭。利用閉包變量時效性不執行不執行不需要時釋放內存去抖動事件最后一次觸發的毫秒后觸發,如電梯門。
節流閥throttle
觸發的事件以周期的形式去執行,而非實時。如滴水的水龍頭。
function throttle (fn, delay) { // 利用閉包變量時效性 let timeout let arg return function () { arg = arguments if (!timeout) { timeout = setTimeout(() => { fn.apply(this, arg) timeout = null }, delay) } } } // demo /* var test = throttle(function (a) {console.log(a)}, 1000) test(1) // 不執行 test(2) // 不執行 test(3) => 3 test = null // 不需要時釋放內存 */去抖動debounce
事件最后一次觸發的N毫秒后觸發,如電梯門。
function debounce (fn, delay){ let timeout return function(){ const args = arguments clearTimeout(timeout) timeout = setTimeout(() => { fn.apply(this, args) }, delay) } } // 用法同throttle
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103454.html
摘要:前言無論是面試還是在討論瀏覽器優化過程中,都會涉及到去抖動和節流的問題。總的來說,這二者是一種限制事件觸發頻率的方式。不同的是,節流會指定事件觸發的時間間隔而去抖動會指定事件不觸發的時間間隔。 前言 無論是面試還是在討論瀏覽器優化過程中,都會涉及到去抖動和節流的問題。總的來說,這二者是一種限制事件觸發頻率的方式。不同的是,節流會指定事件觸發的時間間隔;而去抖動會指定事件不觸發的時間間隔...
摘要:前言無論是面試還是在討論瀏覽器優化過程中,都會涉及到去抖動和節流的問題。總的來說,這二者是一種限制事件觸發頻率的方式。不同的是,節流會指定事件觸發的時間間隔而去抖動會指定事件不觸發的時間間隔。 前言 無論是面試還是在討論瀏覽器優化過程中,都會涉及到去抖動和節流的問題。總的來說,這二者是一種限制事件觸發頻率的方式。不同的是,節流會指定事件觸發的時間間隔;而去抖動會指定事件不觸發的時間間隔...
摘要:可以是數字或者是字符串如果是數字則表示屬性名前加上空格符號的數量,如果是字符串,則直接在屬性名前加上該字符串。 最后更新于2019年1月13日 前端常用代碼片段(一) 點這里前端常用代碼片段(二) 點這里前端常用代碼片段(三) 點這里前端常用代碼片段(四) 點這里前端常用代碼片段(五) 點這里前端常用代碼片段(六) 點這里 1.打亂數組中元素順序(類似音樂隨機播放) function...
摘要:函數節流和去抖的出現場景,一般都伴隨著客戶端的事件監聽。函數節流的核心是,讓一個函數不要執行得太頻繁,減少一些過快的調用來節流。 概述 也是好久沒更新 源碼解讀,看著房價蹭蹭暴漲,心里也是五味雜陳,對未來充滿恐懼和迷茫 ...(敢問一句你們上岸了嗎) 言歸正傳,今天要介紹的是 underscore 中兩個重要的方法,函數節流和函數去抖。這篇文章不會涉及具體的代碼實現(關于代碼實現請期...
閱讀 2626·2021-11-23 09:51
閱讀 2417·2021-09-30 09:48
閱讀 2043·2021-09-22 15:24
閱讀 1008·2021-09-06 15:02
閱讀 3302·2021-08-17 10:14
閱讀 1933·2021-07-30 18:50
閱讀 1980·2019-08-30 15:53
閱讀 3167·2019-08-29 18:43