Создание функции с задержкой вызова (debounce)

Условие

Необходимо написать функцию debounce, принимающую функцию‑обработчик и интервал задержки в миллисекундах, и возвращающую новую функцию‑обёртку. Эта обёртка должна вызывать переданную функцию только после того, как с момента последнего её вызова прошёл указанный интервал.

const debounce = (fn, delay) => {
  // реализация
};

const handleInput = debounce(() => console.log('API call'), 6000);
handleInput();

Ответ

На каждом вызове отменяйте предыдущий таймер и создавайте новый. Callback должен получить последние аргументы и this последнего вызова.

const debounce = (fn, delay) => {
  let timer;
  function wrapped(...args) {
    clearTimeout(timer);
    timer = setTimeout(() => { timer = undefined; fn.apply(this, args); }, delay);
  }
  wrapped.cancel = () => { clearTimeout(timer); timer = undefined; };
  return wrapped;
};

Это trailing-edge вариант без немедленного вызова и без возврата результата fn. При уничтожении компонента вызовите cancel; задержка таймера означает минимальное ожидание, а не точное время исполнения.