多次下划线去抖动调用

Question

调用_.debounce()会导致函数在延迟后执行多次而不是一次。如何让 _.debounce() 内的函数在指定的延迟后执行一次？我的用例是在用户停止输入后执行 AJAX 请求。

例如，在输入中键入内容会在 1 秒后在控制台中显示一条消息。在我的示例中，您会看到多条消息出现（一条消息对应您键入的每个字母）。我将如何修改我的代码以仅查看一条消息？

function onKeyUp() {
    _.debounce(() => {
        console.log('foo');
    }, 1000)();
}
<input onkeyup="onKeyUp()" />

Answer 1

您正在为每个按键事件创建一个新的去抖函数。相反，您需要创建一次并在 onKeyUp 事件处理程序中（或代替）使用此函数。

var handler = _.debounce(() => {
  console.log('foo');
}, 1000)

function onKeyUp() {
  handler();
}

<script src="http://underscorejs.org/underscore-min.js"></script>
<input onkeyup="onKeyUp()" />

Underscore Debounce Calling Multiple Times