“setTimeout"与“debounce"插件-延迟对事件的代码执行

"setTimeout" VS "debounce" plugin - to defer code execution on events

本文关键字:quot 事件 执行 代码 插件 setTimeout debounce 延迟      更新时间:2023-09-26

我想延迟一些事件代码的执行。使用标准setTimeout函数和插件debounce(链接debounce)究竟有什么区别?

这里有一个例子与 setTimeout:

var timeout;
$(window).on("scroll", function() {
    clearTimeout(timeout);
    timeout = setTimeout(function() {
        doSomethingFunction();
    }, 500);
});

这里有一个debounce:

的例子
$(window).on("scroll",
    $.debounce(500, doSomethingFunction)
);

当然,debounce代码更短,但还有其他好处吗?哪个会更快?

debounce在内部使用setTimeout,因此差异与setTimeout被触发的次数有关。

debounce限制它触发setTimeout的次数。如果在短时间内发送多个请求,则只有一个请求会通过。

var timeout_id = setTimeout(
    debounce_mode ? clear
    : exec, debounce_mode === undefined ? delay - elapsed
    : delay
);

您可以查看源代码以获取更多信息。

插件将通过设置超时id来处理超时。