防抖，节流

在进行窗口的resize、scroll、输出框内容校验等操纵的时候，如果事件处理函数调用的频率无限制，会加重浏览器的负担，导致用户体验非常之差。那么为了前端性能的优化也为了用户更好的体验，就可以采用防抖（debounce）和节流（throttle）的方式来到达这种效果，减少调用的频率。

防抖

在事件被触发 n 秒后再执行回调，如果在这 n 秒内事件又被触发，则重新计时。 简单来说，就是执行最后一次。

场景：实时搜索，拖拽。

function debounce(fn,t){
    let timer = null;
    return function(){
        let context = this;
        let args = arguments;
        if(timer){
            clearTimeout(timer);
        }
        timer = setTimeout(()=>{
            fn.apply(context,args);
        },t)
    }
}

节流

规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，如果在同一个单位时间内某事件被触发多次，只有一次能生效。 即执行第一次。

场景：窗口调整（调整大小），页面滚动（滚动），抢购时疯狂点击（鼠标按下）

function throttle(fn,t){
    let timer = null;
    return function(){
        let context = this;
        let args = argumrnts;
        if(!timer){
            timer = setTimeOut(()=>{
                fn.apply(cotect,args);
                timer = null;
            },t)
        }
    }
}