有這樣一種應用場景，在滾動事件中做乙個複雜取值計算或者頻繁的觸發乙個事件，這是很影響效能並容易導致頁面卡頓的，所以要合併多次請求，通過函式做乙個精確操作。這時就會用到函式防抖或者函式節流，那麼，這兩種方式有什麼區別呢？
防抖（debounce）：當持續觸發事件時，一定時間段內沒有再觸發事件，事件處理函式才會執行一次，如果設定的時間到來之前，又一次觸發了事件，就重新開始延時。
節流（throttle）：當持續觸發事件時，保證一定時間段內只呼叫一次事件處理函式。節流通俗解釋就比如我們水龍頭放水，閥門一開啟，水嘩嘩的往下流，秉著勤儉節約的優良傳統美德，我們要把水龍頭關小點，最好是如我們心意按照一定規律在某個時間間隔內一滴一滴的往下滴。
個人認為：
函式節流是：在固定的時間內觸發事件，每隔n秒觸發一次。函式節流不管事件觸發有多頻繁，都會保證在規定時間內一定會執行一次真正的事件處理函式，而函式防抖只是在最後一次事件後才觸發一次函式。 比如在頁面的無限載入場景下，我們需要使用者在滾動頁面時，每隔一段時間發一次 ajax 請求，而不是在使用者停下滾動頁面操作時才去請求資料。這樣的場景，就適合用節流技術來實現。函式防抖是：當你頻繁觸發後，n秒內只執行一次。
1、防抖（類似於 電梯 屏保 類的）
在固定時間內沒有觸發事件會在固定時間結束後觸發，如果在固定時間內觸發了就會延長固定時間
防抖主要利用定時器實現
//用定時器實現防抖
function
debounce
(func,wait)
,wait)
}}
無論在固定時間內是否有事件觸發，都會按照固定時間規律觸發
節流的實現方法有兩種：
第一種：時間戳
//時間戳版本實現節流
function
throttle
(func,wait)
}
//時間戳版本實現節流
function
throttle
(func,wait)
,wait)}}
}
throttle
什麼是防抖和節流？有什麼區別？如何實現？
防抖 連續觸發事件，只要不是最後一次觸發，就不執行非同步操作 點我試試 button var btn document.queryselector button var timer null btn.onclick function 500 script 節流 第一次發生請求後，只要響應沒回來，就不...
防抖和節流 什麼是防抖和節流
目錄二 節流 有這樣一種情況，想象有乙個表單，點選提交按鈕就傳送請求給伺服器。如果使用者在很短的時間間隔內 手抖 點選了多次，又或者是惡意點選，那麼就將傳送多個請求。該行為將造成伺服器額外的不必要負載。所謂防抖，實際上就是是處理這種常見的情況的描述。submit該段 當點選submit按鈕的時候，將...
什麼是防抖和節流？
雖然二者都有延遲當前動作的反饋，但是防抖的延遲時間是確定的，延遲週期內如果有新動作進入，舊的動作將會被取消。而節流是提前設定了乙個閥門，只有當閥門開啟的時候，該動作才有機會執行。如果閥門是關閉的，那這個動作就不會進入執行區。個人理解防抖是後置的處理高頻事件方式，而節流是前置處理。防抖機制隱含了乙個優...