什么是防抖和节流 如何实现防抖和节流
防抖:当持续触发事件时,一段时间内没有再触发,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始计时
节流:当持续触发事件时,保证一定时间段内只调用一次事件处理函数。
应用场景:
防抖
1 search搜索联想 用户在不断输入值时,只有输入完成后,才执行查询的请求,可以减少请求次数,节约请求资源;
2 频繁操作点赞和取消点赞,因此需要获取最后一次操作结果并发送给服务器
3 window触发resize时,不断的调整浏览器窗口大小会不断的触发这个事件,当用户停止改变窗口大小时,再触发事件。用防抖来让其只触发一次
节流
1 鼠标不断点击触发,mousedown 单位时间内只触发一次;
2 scroll滚动事件
区别
函数节流不管事件触发有多频繁,都会保证在规定时间内一定会执行一次真正的事件处理函数,而函数防抖只是在最后一次事件后才触发一次函数。 比如在页面的无限加载场景下,我们需要用户在滚动页面时,每隔一段时间发一次 Ajax 请求,而不是在用户停下滚动页面操作时才去请求数据。这样的场景,就适合用节流技术来实现。