移動端事件（五） 函式防抖和函式節流的封裝

移動端事件（五）—— 函式防抖和函式節流的封裝

我們了解了函式防抖與函式節流的思路後，我們現在來將他們封裝起來，提高**復用性。

cb 要處理防抖的函式

time 預設的高頻間隔時間

isstart 是否在頭部執行

函式防抖封裝：呼叫debounce 函式，返回乙個處理過防抖的函式

lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
#box
style
>
head
>
>
"box"
>
div>
>
function
debounce
(cb,delay =
200,isstart =
false
) timer =
settimeout((
)=>
,delay)}}
box.onmousemove =
debounce
((e)
=>
,200
,true);
script
>
body
>
html
>

lang
="en"
>
>
charset
="utf-8"
>
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
>
documenttitle
>
>
#box
style
>
head
>
>
"box"
>
div>
>
function
throttle
(cb,interval=
200,isstart=
false
) isstart&&cb.
(this
,arg)
; timer =
settimeout((
)=>
,interval)}}
box.onmousemove =
throttle
(function
(e),
500)
script
>
body
>
html
>

移動端事件（四） 函式防抖和函式節流

函式防抖 在對於函式高頻次執行時，只執行一次。有兩種情況 1.尾部執行 高頻次觸發時，只執行最後一次 2.頭部執行 高頻次觸發時，只執行第一次 尾部執行實現很簡單，先設乙個定時器，一開始觸發的時候我不執行，稍微延遲一會後再執行，當你下次執行時，我把上一次的定時器消失，這樣就只會執行最後一次了。防抖尾...

函式防抖和函式節流

1 函式防抖 函式防抖是指頻繁觸發的情況下，只有足夠的時間，才執行 一次，函式防防抖的要點也是要乙個settimeout來輔助實現，延遲執行需要跑的 如果方法多次觸發，則把上次記錄的延遲執行 用cleartimeout清理掉，重新開始。如果計時完畢，沒有方法來訪問觸發。則執行 函式防抖的應用場景，最...

函式防抖和函式節流

首先分別用一句話區分函式防抖和節流的區別。函式防抖就是在使用者停下相應動作，並在給定時間過去之後僅被呼叫一次。函式節流是使用者在執行相應動作時，每隔一段時間發一次請求。針對一些頻繁觸發的事件如scroll keyup resize，如果正常繫結事件的話，可能在很短的時間內連續觸發事件，十分影響效能。...