函数防抖和节流

防抖与节流

函数防抖

在函数被触发后延迟某个时间段后触发，如果在该时间段内再次触发，则重新计时

简单实现

// 防抖函数
function debounce(fun, delay) {
  let record = null
  return (...content) => {
    if (record) {
      clearTimeout(record)
    }
    record = setTimeout(() => {
        fun(...content)
    }, delay)
  }
}

函数节流

在一个时间段内一个函数多次被触发，只有一次会生效

简单实现

// 节流函数
function throttle(fun, delay) {
  let record = null
  return (...content) => {
    if (!record) {
      record = setTimeout(() => {
        fun(...content)
        clearTimeout(record)
        record = null
      }, delay)
    }
  }
}