实现防抖,节流

防抖（debounce）

所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。

function debounce(fn,wait,immediate){
    let timer=null;
    return function Fn(){
        const context=this;
        const args=arguments;
        if(timer) clearTimeout(timer);
        if(immediate){
            let callNow=!timer;
            timer=setTimeout(()=>{
                timer=null;
            },wait)
            if(callNow) fn.apply(context,args);
        }else{
            timer=setTimeout(()=>{
                fn.apply(context,args);
            },wait);
        }
    }
}

节流（throttle）

所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。

//使用时间戳
function throttle(fn,wait){
    let preTime=0;
    return function Fn(){
        let nowTime=Date.now();
        let args=arguments;
        let context=this;
        if(nowTime-preTime>wait){
            Fn.apply(context,args);
            preTime=nowTime;
        }
    }
}

//使用计时器
function throttle(fn,wait){
    let timer;
    return function(){
        const context=this;
        const args=arguments;
        if(!timer){
            timer=setTimeout(()=>{
                fn.apply(context,args);
                timer=null;
            },wait);
        }
    }
}