一、为啥要使用节流和防抖
在项目开发中，我们经常用到的滚动事件或者用户输入事件，都是一些高频事件，如果对这类事件触发的频率没有节制，就会加重浏览器和服务器的负担。节流和防抖目的就是减少事件触发的次数。
1、防抖函数原理（debounce）
在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时
let timer=null
function debounce(callback,delay){
clearTimeout(timer)
timer=setTimeout(()=>{
callback();
},delay)
}
2、节流函数原理（throttle）
事件在n秒内反复被触发，只会执行一次事件
let timer=null;
function throttle(callback,delay){
if(!timer){
timer=setTimeout(()=>{
callback();
clearTimeout(timer);
timer=null;
},delay)
}
}
网友评论