防抖和节流（Debounce & Throttle）

防抖

核心是连续的函数调用只执行一次。

应用场景举例：
输入框停止输入后，发送ajax请求进行校验。
页面滚动事件停止后判断。

代码描述：
触发后，某个时间之后开始执行，如果等待过程中再次触发，则重新开始计时。

function debounce(fn, time) {
  let timer = null
  return function() {
    clearTimeout(timer)
    timer = setTimeout(() => {
      fn.apply(this, arguments)
    }, time)
  }
}

节流

核心是降低函数的执行频率，一个时间段内只执行一次。

应用场景举例：
dom元素的拖拽功能。
射击游戏中单位时间内只能发射一颗子弹。

代码描述：
触发后立刻执行，等待期内再次触发无效，过了等待期可以再次触发。

function throttle(fn, delay) {
  let status = true
  return function() {
    if(status) {
      fn.apply(this, arguments)
      status = false
      setTimeout(() => status = true, delay)
    }
  }
}

参考目录

JavaScript 函数节流和函数去抖应用场景辨析 · Issue #20 · lessfish/underscore-analysis