rxjs中的油门时间与debounceTime之间的区别以及何时选择哪个？

Question

我想了解throttleTime与debounceTime，以及何时使用哪个？

我有一个upvote按钮，该按钮向后端发出一个API请求（对票数进行计数）。用户可以多次提交按钮，但是我想限制每秒可以按下按钮的次数。

我知道油门时间和debounceTime运算符可以做到这一点，但是我应该选择哪个更好呢？

const upvoteClicks = fromEvent(this.el.nativeElement, 'click')
 .pipe(debounceTime(500))
 .subscribe(() => this.myService.postUpvote(this.postId));

Answer 1

（更简单的答案）

假设用户点击触发请求的按钮（示例）：

节流时间 = 可以限制点击次数，因此每秒只有 1 次通过（防止按钮垃圾邮件）

去抖动时间 = 可以在每个请求通过之前添加一个延迟（你按下按钮然后 1 秒内什么都没有发生，然后你的请求通过）

1 秒只是一个例子。您可以在 debounceTime() 或 ThrottleTime() 中输入任何内容 - 以毫秒为单位

Answer 2

我认为在您的情况下，throttleTime会更好一些，因为您希望在用户单击按钮后立即发出api请求。

throttleTime和debounceTime都忽略了同时发生的事件，但是throttleTime立即发出，而 debounceTime等待其他延迟。

您可以在https://rxmarbles.com上很好地看到它

此外，throttleTime vs debounceTime in RxJS文章还对这两个运算符进行了很好的概述。