防抖函数
你尽管触发事件,但是我一定在事件触发 n 秒后才执行,如果你在一个事件触发的 n 秒内又触发了这个事件,那我就以新的事件的时间为准,n 秒后才执行,总之,就是要等你触发完事件 n 秒内不再触发事件,我才执行
实现
function debounce(fn){
let timeout = null;
return function(){
clearTimeOut(timeout)
setTimeOut(() =>{
fn.apply(this,arguments)
},500)
}
}
节流函数
防抖动和节流是不一样的.本质上,防抖动是将多次执行变成最后一次执行.节流是将多次执行变成每隔多久执行一次.减少函数执行频率.
实现
function throttle(fn){
let canRun = true;
return function(){
if(!canRun) return;
canRun = false;
setTimeOut(() => {
fn.apply(this,argument)
canRun = true;
},500)
}
}