JS中的函数防抖

1.什么是函数防抖

概念：函数防抖（debounce）是指触发事件后，在 n 秒内函数只能执行一次，如果触发事件后在 n 秒内又触发了事件，则会重新计算函数延执行时间。

2.什么时候会使用函数防抖

前端开发过程中有一些事件onresize,scroll,mousemove 等等，在短时间内会被频繁触发。如果不做限制的话有可能一秒之内执行几十次、几百次，那不仅会浪费计算机资源，还会降低程序运行速度，严重的话甚至造成浏览器卡死、崩溃，这种问题显然是致命的。所以需要我们去减少不必要的执行次数。

3.代码实现

    /**
     * 防抖
     * @param { Function } fn 执行函数
     * @param { Number } time 延迟时间
     * @param { Boolean } trggleNow 立即触发
     */
    function debounce (fn, time, trggleNow) {
      var t = null;

      var debounced = function () {
        var _self = this,
            args = arguments;
    
        if (t) {
          clearTimeout(t);
        }
        // 进入立即触发
        if (trggleNow) {
          var exec = !t; 
          t = setTimeout(function () {
            t = null;
          }, time);

          if (exec) {
            fn.apply(_self, args);
          }
        } else {
          t = setTimeout(function () {
            fn.apply(_self, args);
          }, time);
        }
      }
      // 清除定时器
      debounced.remove = function () {
        clearTimeout(t);
        t = null;
      }

      return debounced;
    }