防抖與節流

防抖節流傻傻分不清楚概念，總是弄混了，平時還好，要使用的時候google一下就明白了，可是面試要是說反了，那就死翹翹了，對於簡單的知識點，分數一定要拿穩。

節流

當持續觸發事件時，保證一定時間段內只呼叫一次事件處理函式(秉著開源節流的生活觀，雖然我天天逛某寶，可是限制自己乙個月只能買一件，此乃節流)

doctype html
>
<
html
>
<
head
>
<
meta 
charset
="utf-8"
/>
<
title
>節流
title
>
head
>
<
body
>
<
div 
idstyle
="height:600px"
>
div>
<
script
>
window.onload 
=function
()        
function
commonfn(value) , value);}}
}window.addeventlistener(
'scroll
', commonfn(
2000
))    }
script
>
body
>
html
>

防抖

當持續觸發事件時，一定時間段內沒有再觸發事件，事件處理函式才會執行一次，如果設定的時間到來之前，又一次觸發了事件，就重新開始

節流與防抖

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

防抖與節流

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

節流與防抖

在實際開發中，我們經常會遇到一類需求 根據input輸入容來校驗或者搜尋資料，根據視窗的大小變化來進行相關操作等。如果事件操作函式跟使用者的操作保持實時同步，那麼當使用者的操作十分頻繁時，就會多出許多無用的事件操作，並加重瀏覽器的負擔，影響頁面的效能。這時我們可以採用debounce 防抖 和thr...