截流防抖函数经常用在频繁按钮操作中,这两个概念常用但是又容易混淆,下面简单的分析下防抖与截流的异同之处
防抖:意味着防止抖动出现的误操作,也就是防止像抖动一样的频繁操作。
防抖函数里会有个时间限制,当函数在一次执行之后会有个时间间隔,在这个时间间隔范围内是不会再次执行函数的
function debounce(func,delay){
let timer;
return function(){
const that = this;
const args = arguments;
clearTimeout(timer);
timer = setTimeout(()=>func.apply(that,args),delay);
};
}
截流:和防抖一样,也是限制在一段时间限制内频繁的操作。
它和防抖不同的地方在于,它在每一个时间限制内会执行一次
function throttle(func, limit) {
let flag = true; // 开关
return function() {
const args = arguments;
const context = this;
if (flag) {
func.apply(context, args);
flag = false;
setTimeout(() => {flag = true;}, limit);
}
};
}