对同一可观察的多个订阅

Question

我在应用程序的组件之一中有多个订阅，并且可以看到在很多情况下我们重复订阅相同的可观察项。

我最近遇到的一个问题是，在一个订阅逻辑中为一个控件设置值与另一个控件发生冲突，并且两个订阅都在同一可观察对象上。我们通过添加更多特定条件来避免冲突来解决该问题，但令我感到奇怪的是，重复订阅相同的可观察组合真的是一个好习惯（我想我们可以只在单个用户中编写所有逻辑）？从长远来看，它会导致性能问题吗？

    combinelatest(observable1, observable2).pipe(
    tap(() = > {
    // do some logic
    // update Property1 to foo
    })
    ).subscribe();

    combinelatest(observable1, observable2).pipe(
    tap(() = > {
    // do some logic
    })
    ).subscribe();

    combinelatest(observable1, observable2, observable3).pipe(
    tap(() = > {
    // do some logic
    // // update Property1 to foofoo
    })
    ).subscribe();

observable1.pipe(
    tap(() = > {
    // do some logic
    })
    ).subscribe()

非常感谢任何指导。

Answer 1

订阅多次可观察的消息是一种好习惯。但是您必须记住要取消订阅您所进行的订阅。如果您对一个可观察的订阅进行多次订阅而不是取消订阅，则可能会导致内存泄漏。

Answer 2

可观察的共享多次订阅没有问题。但是，可以说，通常可以将可观察的对象分解成有意义的对象以供重用，并且对于每个可观察对象的粒度没有固定的规则，应定义每个可观察对象以适合您的应用程序需求

例如，如果您希望多个组件监听该事件，则可以使用获取博客帖子按钮

const onGetPostClick=fromEvent(button,'click')

然后您要执行get post http调用，还允许其他组件监听此类事件。

const onGetPost=onGetPostClick.pipe(mergeMap(e=>fetch()....),share())

如果您只对新闻类别中的帖子感兴趣

const onGetNews=onGetPost.pipe(filter(post=>post.cat==='news'))

赋予每个可观察的含义，您的代码将变得更加干燥和最少

Answer 3

combinelatest(observable1, observable2).pipe(
  tap(() = > {
  // do some logic
  // update Property1 to foo
  })
).subscribe();

这是对流经流的数据进行突变。这是一种不好的做法，您不应更改流中正在传输的任何数据。您应该创建新对象，而不是对对象进行突变。正确的方法是使用map并返回对象的新实例，而保留原始实例。

combinelatest(observable1$, observable2$).pipe(
  map(([data1, data2]) = > {
  // construct new data object
    return newData;
  })
).subscribe();

在现代JavaScript应用程序中，我们不会对对象进行突变，因为它会导致无法预料的副作用。