函数节流(throttle) 与 函数防抖(debounce)

一、概念

函数节流: 指定时间间隔内只会执行一次任务；

函数防抖: 任务频繁触发的情况下，只有任务触发的间隔超过指定间隔的时候，任务才会执行。

二、实现

function throttle(fn, interval = 300) {

  let canRun = true;

  return function () {

      if (!canRun) return;

      canRun = false;

      setTimeout(() => {

          fn.apply(this, arguments);

          canRun = true;

      }, interval);

  };

}

function debounce(fn, interval = 300) {

  let timeout = null;

  return function () {

      clearTimeout(timeout);

      timeout = setTimeout(() => {

          fn.apply(this, arguments);

      }, interval);

  };

}

参考： https://juejin.im/entry/58c0379e44d9040068dc952f