防抖

用在搜索输入时， 函数防抖在执行目标方法时，会等待一段时间。当又执行相同方法时，若前一个定时任务未执行完，则 clear 掉定时任务，重新定时。

代码实现

function debounce(fn,delay){
     let timer = null;
     return function(){
         if(timer){
             clearTimeout(timer);  //说明当前正在计时，并且触发了相同的事件，所以需要取消当前计时，重新开始计时
         }
         timer = setTimeout(()=>{
             fn();
         },delay) //说明当前没有计时，开始计时
     }
 }

节流

用在连续点击div时， 是为了限制函数一段时间内只能执行一次，在延时的时间内，方法若被触发，则直接退出方法。

代码实现

function throttle(fn,delay){
    let valid = true;
    return function(){
        if(!valid){
            //休息事件，暂不做操作
            return false;
        }
        //执行函数并且在间隔期内把状态设置为无效
        valid = false;
        setTimeout(()=>{
            fn();
            valid = true;
        },delay)
    }
}