Rxjs 多播操作符:share, publish 和 refCount 实战

阅读时长 5 分钟读完

前言

Rxjs 是在 Web 应用中非常流行的响应式编程库,其提供了多种操作符以简化事件流的处理。常见的操作符包括 map、filter、reduce 等等。然而,当事件流需要被多个观察者共享时,就需要用到 Rxjs 中的多播(multicast)操作符。本文将介绍 Rxjs 中的 share、publish 和 refCount 这三个多播操作符,在实战中演示它们的用法。

share

share 操作符可以将一个可观察对象转化为可重用的序列,以防止订阅者重新订阅源可观察对象并复制对它的副本。这对于在应用程序中跨多个组件和服务共享可观察对象的场景非常有用。该操作符接收一个可选的 bufferSize 参数:

其中 bufferSize 指定了缓冲区的大小,当订阅者数量达到 bufferSize 时,新的订阅者将会继续共享之前创建的可观察对象,而不是重新订阅源可观察对象。如果 bufferSize 未指定,则默认为 1。

下面的示例展示了如何使用 share 操作符:

-- -------------------- ---- -------
------ - -- - ---- -------
------ - ------ ----- - ---- -----------------

----- ---------- - ----- -- --------
  ------------
  -------
--

-------------------------- -- --------------------- -- ------------
------------- -- -
  -------------------------- -- --------------------- -- ------------
-- ------

可观察对象 observable 初始被订阅后,它的值将延迟 1 秒钟输出,然后第一个订阅者将会接收到值 1、2 和 3,而第二个订阅者需要等待 2 秒钟才能接收到 2 和 3。在使用了 share 操作符之后,第二个订阅者将不再重新订阅 observable,而是直接共享之前创建的可观察对象。因此,第二个订阅者会立即接收到 2 和 3。

publish

publish 操作符可以将一个可观察对象转化为可重用的序列,但与 share 操作符不同的是,它可以通过其返回的 ConnectableObservable 对象控制可观察对象的订阅和取消订阅。该操作符接收一个可选的 selector 函数:

其中 selector 函数将可观察对象转化为另一个可观察对象,以便订阅者只接收特定的值、更新或事件。

下面的示例展示了如何使用 publish 操作符:

-- -------------------- ---- -------
------ - -- - ---- -------
------ - ------ ------- - ---- -----------------

----- ---------- - ----- -- -------------------- -----------

-------------------------- -- --------------------- -- ------------

----- ------------ - ---------------------

------------- -- -
  -------------------------- -- --------------------- -- ------------
-- ------

------------- -- -
  ---------------------------
-- ------

可观察对象 observable 初始被订阅后,它的值将延迟 1 秒钟输出,然后第一个订阅者将会接收到值 1、2 和 3。在调用其返回的 ConnectableObservable 对象的 connect 方法之前,observable 的值并不会被第二个订阅者接收。因此,第二个订阅者需要等待 2 秒钟才能接收到 1、2 和 3。在等待 3 秒钟之后,subscription 对象的 unsubscribe 方法将会取消对 observable 的订阅。这意味着第一个订阅者将不再接收到 observable 的值。

refCount

refCount 操作符可以指定在一个或多个观察者订阅可观察对象时开始发出值,并在没有活动的订阅者时暂停发出值的行为。这对于在应用程序中需要自动启动/停止事件源和资源的场景非常有用。该操作符不接受任何参数:

下面的示例展示了如何使用 refCount 操作符:

-- -------------------- ---- -------
------ - -- - ---- -------
------ - ------ -------- -------- - ---- -----------------

----- ---------- - ----- -- -------------------- ---------- ------------

-------------------------- -- --------------------- -- ------------

------------- -- -
  -------------------------- -- --------------------- -- ------------
-- ------

可观察对象 observable 初始被订阅后,它的值将延迟 1 秒钟输出,然后第一个订阅者将会接收到值 1、2 和 3。在有一个订阅者时,refCount 操作符会自动开始发出值。在第二个订阅者订阅之后,refCount 操作符会保持发出值状态。如果没有活动的订阅者,refCount 操作符会停止发出值。因此,第二个订阅者需要等待 2 秒钟才能接收到 2 和 3。

结论

Rxjs 中的 share、publish 和 refCount 这三个多播操作符是非常有用的,可以大大简化事件流的处理。在实际应用中,我们应该考虑使用它们来提高应用程序的性能和可维护性。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6704e28ad91dce0dc8509de9

纠错
反馈