因為最近在做影象處理，觸及到一些滑鼠事件，像mouseover、scroll，視窗的resize等事件會頻繁觸發，造成卡頓，使用者體驗非常不好。
概念：當持續觸發事件時，一定時間段內沒有再觸發事件，事件處理函式才會執行一次，如果在這段時間裡再次一次觸發了事件，就取消之前的延時呼叫函式，重新開始延時呼叫函式。
例如當持續觸發scroll事件時，事件處理函式handle只在停止滾動1000毫秒之後才會呼叫一次，也就是說在持續觸發scroll事件的過程中，事件處理函式handle一直沒有執行。
**實現：
function
debounce
(fn, wait);}
// 處理函式
function
handle()
// 滾動事件
window.
addeventlistener
('scroll'
,debounce
(handle，1000))
;
概念：當持續觸發事件時，保證一定時間段內只呼叫一次事件處理函式。
持續觸發scroll事件時，並不立即執行handle函式，每隔1000毫秒才會執行一次handle函式。
**實現：
// 節流throttle**（時間戳+定時器）：
varthrottle
=function
(func, delay)
else}}
function
handle()
window.
addeventlistener
('scroll'
,throttle
(handle,
1000))
;
防抖和節流 什麼是防抖和節流
目錄二 節流 有這樣一種情況，想象有乙個表單，點選提交按鈕就傳送請求給伺服器。如果使用者在很短的時間間隔內 手抖 點選了多次，又或者是惡意點選，那麼就將傳送多個請求。該行為將造成伺服器額外的不必要負載。所謂防抖，實際上就是是處理這種常見的情況的描述。submit該段 當點選submit按鈕的時候，將...
防抖和節流
在前端開發過程中，我們經常需要繫結一些持續觸發事件，如 resize scroll mousemove等等，但有些時候我們並不希望在事件持續觸發的過程中那麼頻繁的去執行函式。通常這種情況下，我們怎麼去解決呢？一般來講，防抖和節流是比較好的解決方案。一 函式的防抖 1 什麼是函式防抖 函式防抖 deb...
防抖和節流
防抖和節流的作用都是防止函式多次呼叫。區別在於，假設乙個使用者一直觸發這個函式，且每次觸發函式的間隔小於設定的時間，防抖的情況下只會呼叫一次，而節流的情況會每隔一定時間呼叫一次函式。1.防抖 函式防抖 debounce n秒內函式只會執行一次，如果n秒內高頻事件再次被觸發，則重新計算時間。如下例，對...