js 防抖与节流(画图讲解)

防抖与节流都是控制频繁访问，减少访问次数的手段

一、防抖Debounce        频繁访问中最后一次有效

    function debounce(){
        let timer = null;

        return function(){
          if(timer){
            clearTimeout(timer);
          }

          timer = setTimeout(()=>{
            fun();
            timer = null;
          },1000)
        }

    }

二、节流Throttle        第一次有效

 

  function throttle(fun, time){
    let timer = null;

    return function(){
      if(timer){
        return;
      }
      timer = setTimeout(()=>{
        fun();
        timer = null;
      },time)
    }

  }

！比较二者代码不同之处 每次检验定时器是否已存在 若存在

                                防抖清除定时器，节流直接return