(一)防抖和节流是什么?
防抖:短时间内触发了多个setTimeout,只会执行最后一个。
节流:短时间内触发多个setTimeout,一段时间内只执行一次。
防抖和节流的原理都用到了闭包:里面的变量只会在闭包中使用,不会受到外部的污染。
(二)防抖和节流的原理
防抖:在执行setTimeout之前,先使用clearTimeout() 把上一次定时器给清除掉,这样就达到了只会执行最后一次触发的setTimeout。
节流:在第一次触发了setTimeout之后,先把阀门关闭,等待执行完后再把阀门打开,这样后面的setTimeout在触发前会判断阀门是否关闭,如果关闭了则不会继续触发,要等之前的setTimeout执行完后,才允许触发后面的setTimeout。
P S :封装防抖函数
function double(fn, time) {
let timer;
return ()=> {
clearTimeout(timer)
timer = setTimeout(() => {
fn()
}, time)
}
}