RXJS操作员:缓冲区
#javascript #网络开发人员 #rxjs #typescript

rxjs是一个JavaScript库,可实现异步和基于事件的程序的创建。主要类型是Observable,提供了一套功能和运算符,以使与数据通过的数据更容易。该系列将详细介绍这些操作员(以及一些独立功能),并提供其使用的示例。

在这篇文章中,我们将覆盖buffer操作员。

它有什么作用?

buffer操作员让我们从可观察到的值中将值捆绑在一起,并将它们全部处理在一起。我们将buffer传递给第二个可观察到的可控制何时输出值的可观察。一旦第二个可观察的发出消息,所有收集的值都将通过管道的其余部分作为数组推动。

例子

import { Subject, buffer, interval } from 'rxjs';

const bufferTrigger$ = new Subject<void>();

interval(1000)
    .pipe(buffer(bufferTrigger$),)
    .subscribe(x => {
        console.log(x);
    });

setInterval(() => {
    bufferTrigger$.next();
}, 5000);

我们使用interval每秒为我们提供增加数字。每5秒bufferTrigger$都会发射并迫使buffer将其具有的任何值传递给其余管道。如果我们运行此操作,我们会看到:

[ 0, 1, 2, 3 ]
[ 4, 5, 6, 7, 8 ]
[ 9, 10, 11, 12, 13 ]
[ 14, 15, 16, 17, 18 ]

我们可以看到缓冲区花了5秒钟收集值。一旦扳机启动,它就将它们置于阵列中,然后将其转发。只需确保将来自原始观察值的值和扳机上的时机对齐。否则,buffer最终将收集比您预期的更多值,这可能会导致问题。我们不想用完记忆,因为我们没有清除缓冲区。

此示例的源代码可在GitHub上获得: