Write a JavaScript throttle function

Similar to a debounce function, throttle is used to limit how often a function can be called, though throttle is simpler to implement. It takes fn, which is the function you want to be throttled, and limit, which is the time you want to enforce it to wait before being fired again.

It is implemented by wrapping the function and returning it with a timeout. When the function gets called it checks to see if a timeout is in session. If not it fires it, and then sets a timeout to the time of limit. If a timeout is in session, it becomes a no-op.

Implementation

function throttle(fn, limit) {
  let waiting = false
  return (...args) => {
    if (!waiting) {
      fn.apply(this, args)
      waiting = true
      setTimeout(() => {
        waiting = false
      }, limit)
    }
  }
}

// usage
let log = () => console.log('throttled')
window.addEventListener('keyup', throttle(log, 100))

Menu