淺談 Underscore.js 中 _.throttle 和 _.debounce 的差別[轉]

看的文章來自： https://blog.coding.net/blog/the-difference-between-throttle-and-debounce-in-underscorejs

使用場景

只要牽涉到連續事件或頻率控制相關的應用均可以考慮到這兩個函數，好比：

• 遊戲射擊，keydown 事件
• 文本輸入、自動完成，keyup 事件
• 鼠標移動，mousemove 事件
• DOM 元素動態定位，window 對象的 resize 和 scroll 事件

 

文章裏有個比喻很形象

• throttle 策略的電梯。保證若是電梯第一我的進來後，15秒後準時運送一次，不等待。若是沒有人，則待機。
• debounce 策略的電梯。若是電梯裏有人進來，等待15秒。若是又人進來，15秒等待從新計時，直到15秒超時，開始運送。

 

評論裏也很精彩：

throttle:觸發-上次動做執行時間〉大於限制時間->執行動做，記錄執行時間
debounce:觸發-記錄觸發時間-上次動做觸發時間〉大於限制時間-執行動做

-----------

能看明白了吧。

throttle  ： 定時定點

debounce ： 做延遲處理