防抖的标准写法为:
function debounce(fn, delay){
let timer = null;
return function(){
if(timer){
clearTimeout(timer)
timer = setTimeOut(fn, delay)
}else{
timer = setTimeOut(fn, delay)
}
}
}
为什么要将timer放入函数内部?
timer作为全局变量放在函数外面也是可以的,但是只限于用于一个业务。如果debounce被不同的业务使用,这些业务将会一起操作timer,完全乱套。
为什么要用闭包?
为什么不能这样写呢?
function debounce(fn, delay){
let timer = null;
if(timer){
clearTimeout(timer)
timer = setTimeOut(fn, delay)
}else{
timer = setTimeOut(fn, delay)
}
}
document.getElementById("div1").οnmοuseοver =
debounce(function(){alert("fuckoff")}, 500)
首先知道闭包的有一个作用就是可以使父级函数的内部环境在变量中一直存在。参考这个
比如有个业务使用了debounce函数,用闭包后,对于该业务,timer将会一直存在,如果不用闭包,每次触发将会生成一个新的time,if (timer)将永远不会被触发。
如果此时又有一个业务使用了debounce,用闭包的情况下,会为这个新的业务生成一个新的timer。
解释完毕。