#防抖与节流

/**
 * 防抖
 */
export function debounce<T>(fn: (...args: T[]) => void, ms = 1000) {
  let timer: ReturnType<typeof setTimeout> | null = null

  return function (this: ThisParameterType<typeof fn>, ...args: T[]) {
    if (timer) {
      clearTimeout(timer)
    }

    timer = setTimeout(() => fn.apply(this, args), ms)
  }
}

/**
 * 节流
 */
export function throttle<T>(fn: (...args: T[]) => void, ms = 1000) {
  let timer: ReturnType<typeof setTimeout> | null = null

  return function (this: ThisParameterType<typeof fn>, ...args: T[]) {
    if (timer) return

    timer = setTimeout(() => {
      fn.apply(this, args)
      timer = null
    }, ms)
  }
}

button {
  animation: throttle 2s step-end forwards;
}
button:active {
  animation: none;
}
@keyframes throttle {
  from {
    pointer-events: none;
  }
  to {
    pointer-events: all;
  }
}