JS基础-防抖和节流

Posted 2023-05-12

参考技术A

2022.3.19补充
节流函数的另一种实现方式：

两者的区别：
防抖函数：在一定时间内执行一个方法多次，只执行最后一次。因为在事件触发会先清理timer，如果时间间隔不到则会被清理掉，只有你的间隔到了之后才会执行，因此前面的函数都会被清理掉。
节流函数：在一定时间内执行一个方法多次，只有第一次生效。因为在事件触发后会先判断timer是否存在，只有不存在的时候才会执行。
相当于防抖是强制清理，节流是不到时间进不了大门。

JS的防抖和节流

参考技术A

应用场景： input输入信息进行搜索，如果每敲一个字符就请求后台接口，给后台的压力太大了，所以做好防抖，即让程序只执行最后一次的事件。
为解决该问题，探索到了两个解决方案：

直接使用lodash工具库的debounce方法
参考网址： https://blog.csdn.net/qq_39139322/article/details/103295326

应用场景： 滚轮滚动触发事件频繁，加上延迟可低频触发
看过了上面闭包防抖的写法，下面闭包节流的写法也很好理解了~