js中实现防抖与节流

防抖

export function debounce(fn, delay) {
  let timer = null
  return function(...args) {
    clearTimeout(timer)
    timer = setTimeout(() => {
      fn.call(this, ...args)
    }, delay)
  }
}

// 使用方式
const onResize = debounce(function() {
  // ...
}, 300)

节流

export function throttle(fn, delay, cb) {
  let time = null
  return function(...args) {
    const curTime = Date.now()
    if (time && curTime - time < delay) {
      return typeof cb === 'function' && cb.call(this)
    }
    time = curTime
    fn.call(this, ...args)
  }
}

// 使用方式
const query = throttle(
  function() {
    // ...
  },
  1000,
  function() {
    console.log('请求次数过于频繁')
  }
)

注意不要使用箭头函数，不然会导致 this 错乱，因为 call 也无法改变箭头函数 this 指向