Hello小伙伴们，因为Ajax绕去http了几天，今天又回到了JS，今天要为大家介绍的是防抖和节流，听起来就很厉害的样子吧~想必大家在生活中也会经常干这种事情，比如在浏览一个网站的时候，要点击一个按钮，当这个点击动作没有做出反应的时候，用户便会一直不停的按，又或者再有滚动条的页面，不断上下滚动鼠标等等，都会造成不断触发事件甚至不断发送请求，为了防止这个就要采用防抖和节流的方法了。
同样是解决快速连续触发、不可控高频触发，防抖和节流又分别是什么呢，有什么区别呢？让我们一同看看吧~
防抖
多次触发事件后，事件处理函数只执行一次，并且是在触发操作结束时执行。对处理函数进行延时操作，若设定的延时到来之前，再次触发事件，则清除上一次的延时操作定时器，重新定时。（这就是个小傲娇，我执行完就是要等n秒再执行，你再按我再等n秒）
代码语言：javascript复制function debounce(fn,time) {
let timer;
return function () {
let self = this;
timer && clearTimeout(timer);
timer = setTimeout(function (...args) {
fn.apply(self,args);
},time);
}
}节流
触发函数事件后，短时间间隔内无法连续调用，只有上一次函数执行后，过了规定的时间间隔，才能进行下一次的函数调用。对处理函数进行延时操作，若设定的延时到来之前，再次触发事件，则清除上一次的延时操作定时器，重新定时。（说白了就是一直在跑，只不过一定时间就能跑一次，这不就节流了嘛~）
代码语言：javascript复制function throttle(fn, time) {
let timer,start;
return function func(...args) {
let self = this;
let now = Date.now();
if(timer){
clearTimeout(timer);
}
else if(now - start >= time){
fn.apply(self, args);
start = now;
}else {
timer = setTimeout(function () {
func.apply(self, args);
}, time);
}
}
}今天的内容就到这里啦，总的来说呢，防抖就是合并多次触发操作，节流就是保证一段时间事件就被触发一次，记住了吗~喜欢兔妞的文章请关注 右下角点击好看哟，越点越好看~~么么哒！！！
