-
Notifications
You must be signed in to change notification settings - Fork 132
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
浅谈节流与防抖 #36
Comments
little bottle,你能把这俩的es版本搞一致吗。。。。 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
节流和防抖在开发项目过程中很常见,例如 input 输入实时搜索、scrollview 滚动更新了,等等,大量的场景需要我们对其进行处理。我们由 Lodash 来介绍,直接进入主题吧。
Lodash
API
防抖 (debounce) :多次触发,只在最后一次触发时,执行目标函数。
节流(throttle):限制目标函数调用的频率,比如:1s内不能调用2次。
lodash 在 opitons 参数中定义了一些选项,主要是以下三个:
根据 leading 和 trailing 的组合,可以实现不同的调用效果:
{leading: true, trailing: false}:只在延时开始时调用
{leading: false, trailing: true}:默认情况,即在延时结束后才会调用函数
{leading: true, trailing: true}:在延时开始时就调用,延时结束后也会调用
deboucne 还有 cancel 方法,用于取消防抖动调用
使用
防抖 (debounce):
首次点击时执行,连续点击且时间间隔在500ms之内,不再执行,间隔在500ms之外再次点击,执行。
节流(throttle):
首次点击时执行,连续点击且间隔在500ms之内,500ms之后自动执行一次(注:连续点击次数时间之后小于500ms,则不会自动执行),间隔在500ms之外再次点击,执行。
源码实现
debounce
throttle
The text was updated successfully, but these errors were encountered: