javascript debounce : how to get e. 目标？

Question

我正在使用 https://davidwalsh.name/javascript-debounce-function 中的去抖实现.

现在的问题是:如何从事件监听器获取事件(e.target)并在去抖函数中使用它？

这是我想出的:

document.querySelector('textarea')
  .addEventListener('input', (e) => {
     debounce(
         () => { console.log('debounce at '+e.target.value); },
         1000,
         false
     )(e); // add (e) so that the function debounce returns gets called inside the anonymous function
  });

问题是它立即触发(并且去抖效果被有效消除)。

Answer 1

您需要包装输入事件处理程序，如下所示:

function handler(e) {
  console.log('debounce at '+e.target.value); 
}
const debouncedHandler = debounce(handler, 1000)
document.querySelector('textarea').addEventListener('input',debouncedHandler, false)

现在，当事件触发时，它将调用相同的处理程序，而不是新的处理程序

demo