浅谈 Underscore.js 中 _.throttle 和 _.debounce 的差异[转]

Posted 2020-09-22 前端js

看的文章来自： 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 ： 作延迟处理