LoDash 的 debounce接受一个选项maxWait
。
从文档:
[options.maxWait]
(number):func
调用前允许延迟的最大时间。
我很困惑,这不是和使用油门一样吗?有什么不同?
如果你查看源代码,你会发现throttle 实际上是一个用于去抖动的瘦包装器。油门调用使用 maxWait 属性去抖动 https://github.com/lodash/lodash/blob/4.17.11/lodash.js#L10898-L10914
因此,如果您在 maxWait 和 trailing 和leading 设置为 true 的情况下调用 debounce,它将具有与调用油门相同的效果。
它们是一个相似的概念,但完全不同。
maxWait
- 在调用函数之前等待的时间量。
throttle
-呼叫之间的等待时间。
throttle
当您多次调用一个函数并且不希望它被频繁调用时使用。 maxWait
当您延迟执行单个事件时使用。
编辑在这里添加更多细节:
_throttle 和 _debounce 之间的区别有点微妙。
_debounce 创建一个函数:
创建一个函数,该函数将延迟 func 的执行,直到自上次调用它以来经过了等待毫秒。
而 _throttle 创建一个函数:
创建一个函数,在执行时,每等待毫秒最多只调用一次 func 函数。
_debounce 实际上允许发生后续调用,但会延迟它们的处理,而 _throttle 实际上不允许在等待期间调用。
你可以多次去抖动一个函数,理论上无限期地延迟它。maxWait
可用于确保函数最终被调用。
leading
andtrailing
选项不会导致函数的额外运行;相反,它们控制函数何时执行。
Usingleading
导致函数执行,随后的调用被去抖动。
Usingtrailing
导致函数在去抖动结束时执行,这可能小于超时。本质上,您允许在最后一次去抖动时间结束后立即进行后续调用,而不是在中间开始时强制它们等待整个超时。
注意:如果前导和尾随选项为真,则仅当在等待超时期间多次调用去抖动函数时,才会在超时的后沿调用 func。
因此,理论上,如果您使用所有 3 个选项(leading
、maxWait
和trailing
),则maxWait
不会发生,因为您永远不会超过等待期,并且trailing
只有在同一等待期内调用该函数两次时才会发生。