函数节流和函数防抖

2019-07-28  本文已影响0人  oneways

函数节流:一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。
-有个需要频繁触发函数,处于优化性能角度,在规定时间内,只让函数触发的第一次生效,后面不生效。

function throttle(fn,delay){
          //记录上一次函数触发的时间
          var lastTime = 0;
          return function(){
              //记录当前函数触发的时间
              var nowTime = Date.now();

              if(nowTime-lastTime > delay){
                //修正this指向问题。
                  fn.call(this);
                  //同步时间
                  lastTime = nowTime;
              }
          }
      }
      document.onscroll = throttle(function(){
          console.log("scrollb被触发了!"+ Date.now());
      },200)

防抖函数:一个需要频繁触发的函数,在规定的时间内,只让最后一次生效,前面的不生效。

 function debounce(fn,delay){
        //记录上一次的延时器
        return function(){
          var timer = null;
          //清楚上一次延时器
          clearTimeout(timer);
          //重新设置新的延时器
          timer = setTimeout(function(){
            fn.apply(this);
          },delay);
        }
      }
上一篇 下一篇

猜你喜欢

热点阅读