如何在 RXJS 5+ 中按时间有效地对事件进行分组

Question

我有 4 种不同类型的事件，我使用 Observable.fromEvent(object, 'type1') 转换为 observable。它们触发的事件有以下组合。

1. 仅类型 1。
2. 类型1，类型2
3. 类型1，类型3
4. type1，type4，
5. type2，type1，type3
6. type3，type4，type1

因为没有直接的模式。我使用了合并和缓冲时间。如下所示对事件进行采样。

const e1 = Observable.fromEvent(ob1, 'type1');
const e2 = Observable.fromEvent(ob1, 'type2');
const e3 = Observable.fromEvent(ob1, 'type3');
const e4 = Observable.fromEvent(ob1, 'type4');

const merged = merge(e1, e2, e3, e4);
const sampled = merged.bufferTime(500);
sampled.subscribe(e=>console.log(e));

虽然上面的代码有效，但是每个.5s 都会发出数据，如果没有事件，则发出空数据。我尝试使用buffer，但在RXJS 5+ 中，缓冲区只有closingselector 功能。

如何使用可观察对象，使计时器从空缓冲区开始并结束 x+.5 秒，而不是每 0.5 秒采样一次。

Answer 1

您可能想使用debounceTime 来buffer。 debounceTime 运算符执行以下操作：

仅在经过特定时间跨度且没有其他源发射时才从源 Observable 发射一个值。

换句话说，它只会在最近的发射之后发射x秒。因此，您最终不会得到任何空数据排放。

您可以将其与 buffer 一起使用，以从您的主流中收集“块”排放，如下所示：

const second = 1000;
const debounced = merged.debounceTime(.5 * second);
const sampled = merged.buffer(debounced);

我实际上写了一篇关于收集按钮点击的博客文章，它使用了这种精确的方法（并且更详细）：http://www.vincecampanale.com/blog/2017/05/24/learn-rxjs-with-a-button/。