debounceTime：測試代碼

import {concat,debounceTime,filter,interval,mapTo,of,take,throttleTime, } from 'rxjs';const a = of(1); const b = of(2);const c = concat(a, b);c.subscribe((data) => console.log(data));const a1$ = interval(500).pipe(take(2), mapTo('A')); const a2$ = interval(1000).pipe(take(3), mapTo('B')); const a3$ = interval(500).pipe(take(3), mapTo('C')); const source$ = concat(a1$, a2$, a3$);const result$ = source$.pipe(debounceTime(800));result$.subscribe((data) => console.log(data));

最后輸出：A B B C

彈珠圖：

第一階段的兩個 A，只有后者才能進入下游，因為第二個 A 和第二階段的第一個 B，間隔時間大于 800 毫秒。

第二階段的前兩個 B 能夠進入下游，而最后一個 B 不行，∵最后一個 B 和第三階段的第一個 C 時間間隔小于 800 毫秒。

上游完結時，生成的最后一個元素，總是能進入下游。

如果改成 throttleTime，輸出的序列為：A B B B C

彈珠圖：

第二個 A 和 第一個 A 的時間間隔小于 800 毫秒，故不能進入下游。三個 B 的生成間隔全部大于 800 毫秒，故全部進入下游。第二個 C 生成時，距離最后一個 B 的生成已經過去了 1秒鐘，時間間隔大于 800 毫秒，故第二個 C 進入下游。

更多Jerry的原創文章，盡在：“汪子熙”:

總結

以上是生活随笔為你收集整理的debounceTime 和 throttleTime 的弹珠图的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。