下面的两个都是立即执行版:
// debounce 防抖
function debounce (fn,immediate) {
var timer;
return function() {
if(timer) clearTimeout(timer);
immediate && !timer && fn(); // 首次进入,立即执行(立即执行开启,定时器没开启)
timer = setTimeout(() => {
timer = null;
}, 1000)
}
}
// throttling 节流
function throttling(fn,immediate) {
var timer;
return function () {
if (timer) return false;
!timer && immediate && fn();
timer = setTimeout(() => {
timer = null;
}, 1000)
}
}
document.getElementById("btn").onclick = throttling(function () {
console.log(1)
},true)
总结: 可以发现防抖节流的区别在于 一开始的判断定时器存在所做的处理,防抖是清除定时器重新来,节流是 return false 等待定时器自动清除。