**什么是防抖和节流?有什么区别?如何实现?**

防抖和节流都是防止一个函数多次被调用,假如一个用户多次调用一个函数,且每次调用的时间小于设定的时间,那么防抖只能执行一次,节流等待时间大于设定时间就会执行一次,
节流: n 秒内只运⾏⼀次,若在 n 秒内重复触发,只有⼀次⽣效
防抖: n 秒后在执⾏该事件,若在 n 秒内被重复触发,则重新计时
相同点:
都可以通过使⽤ setTimeout 实现
⽬的都是,降低回调执⾏频率。节省计算资源
不同点:
函数防抖,在⼀段连续操作结束后,处理回调,利⽤ clearTimeout 和 setTimeout 实现。函数节
流,在⼀段连续操作中,每⼀段时间只执⾏⼀次,频率较⾼的事件中使⽤来提⾼性能
函数防抖关注⼀定时间连续触发的事件,只在最后执⾏⼀次,⽽函数节流⼀段时间内只执⾏⼀次
应⽤场景
防抖在连续的事件,只需触发⼀次回调的场景有:
搜索框搜索输⼊。只需⽤户最后⼀次输⼊完,再发送请求
⼿机号、邮箱验证输⼊检测
窗⼝⼤⼩ resize 。只需窗⼝调整完成后,计算窗⼝⼤⼩。防⽌重复渲染。

猜你喜欢

转载自blog.csdn.net/m0_45865109/article/details/127175227
今日推荐