防抖函數和節流函數

防抖函數

在連續點擊n次的時間之內，只取最後一次操作；

概念： 在事件被觸發n秒後再執行回調，如果在這n秒內又被觸發，則重新計時

function debounce(fn,delay){
    var timer=null;
    return (...args)=>{
        clearTimeOut(timer);
        var timer=setTimeOut(()=>{
            fn.apply(this,args);
        },delay)
    }

}

節流

在固定的時間之內執行；例如每隔2秒執行一次，在這2秒鐘之間無論點擊多少次。都只執行1次；

概念： 規定一個單位時間，在這個單位時間內，只能有一次觸發事件的回調函數執行，如果在同一個單位時間內某事件被觸發多次，只有一次能生效

function throttle(fn,delay){
    var flag=true;
    return (...args)=>{
        if(!flag) return;
        flag=false;
        setTimeOut(()=>{
            fn.applay(this,args);
            flag=true;
        },delay)
    }
}