节流防抖

防抖

• 含义：防抖可以概括为触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间

应用场景(举例)：

• 1:输入框

    /**
     * @desc 函数防抖
     * @param func 函数
     * @param delay 延迟执行毫秒数
     */
    function debounce(func, delay) {
      let timer = null;
      return function(...args) {
        if (timer) {
          clearTimeout(timer);
        }
        timer = setTimeout(() => {
          func.apply(this, args);
          timer = null;
        }, delay);
      }
    }

节流

• 含义：高频事件触发，但在n秒内只会执行一次，节流会稀释函数的执行频率

应用场景(举例)：

• 1:窗口调整
• 2: 页面滚动
• 3:抢购和疯狂点击

    /**
     * @desc 函数节流
     * @param func 函数
     * @param delay 延迟执行毫秒数
     */
    function throttle(func, delay) {
      let lastTime = 0;
      return function(...args) {
        let now = Date.now();
        if (now - lastTime > delay) {
          func.apply(this, args);
          lastTime = now;
        }
      }
    }