js之防抖和节流实现

1、什么是防抖和节流

首先，防抖和节流都是用于处理某时间区间内单一连续时间的技术

防抖：可以理解为只处理最后一次事件，即在上一次事件未执行时又触发了新的事件，则旧的事件取消计时，新的事件重新计时。

节流：可以理解为处理第一次事件，即上一次事件未执行时，新的事件无法触发和计时。

2、源码实现

      //   防抖
      function debounce(fn, time) {

        // 闭包变量记定时器
        let timer = null;

        return function () {

          let args = arguments;

          clearTimeout(timer);

          timer = setTimeout(() => {

            fn.apply(this, args);

          }, time);
        };
      }


      //  节流
      function throttle(fn, time) {

        let timer = null;

        return function () {
          let args = arguments;

          if (!timer) {

            timer = setTimeout(() => {

              fn.apply(this, args);

              timer = null;

            }, time);
          }
        };
      }