防抖與節流常見的幾種實現方式

防抖與節流常見的幾種實現方式

防抖在限制的時間內持續觸發事件的時候，函式是完全不執行的

非立即執行版，等最後一次觸發結束的一段時間之後，再去執行

function debounce(func, delay) , delay)

}}

function debounce(func,wait) , wait)

}}

/**

* @desc 函式防抖
* @param func 函式
* @param wait 延遲執行毫秒數
* @param immediate true 表立即執行，false 表非立即執行
*/function debounce(func,wait,immediate) , wait)
}else , wait);}}
}

function throttle(func, deley) 

run = false // 持續觸發的話，run一直是false，就會停在上邊的判斷那裡
settimeout(() => , deley)
}}

實現防抖節流

防抖 debounce 不管事件觸發頻率多高，一定在事件觸發n秒後才執行，如果你在乙個事件觸發的 n 秒內又觸發了這個事件，就以新的事件的時間為準，n秒後才執行，總之，觸發完事件 n 秒內不再觸發事件，n秒後再執行。直接上 例如頁面視窗一直在改變 停止的是n秒後執行事件 window.onload ...

節流與防抖

瀏覽器中某些計算和處理要比其他的昂貴，例如在瀏覽器中操作dom比非dom互動需要更多的記憶體和cpu的事件，連續嘗試進行過多的dom相關操作可能ui導致瀏覽器掛起，有時甚至會崩潰。尤其在ie中使用onresize事件處理程式的時候容易發生，當調整瀏覽器大小的時候，該事件會連續觸發。在onresize...

防抖與節流

防抖 當事件持續觸發，一定時間內沒有觸發事件函式處理一次。比如輸入框的ajax請求做模糊查詢 節流 當時間持續觸發，在一秒內只能觸發一次。比如滾動條持續向下滾動，載入更多資料 function debounce fn,wait function throttle func,delay functio...