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

在可观察的共享上多次订阅没有任何问题。话虽这么说，通常可以将可观察的对象分解为有意义的对象以供重用，并且没有针对每个可观察对象的粒度的固定规则，应该定义每个可观察对象以适合您的应用程序需求

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

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 2

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

Answer 3

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

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

combinelatest(observable1$, observable2$).pipe(
  map(([data1, data2]) = > {
    return [data1, { ...data2, prop1: 'foo' }];
  })
).subscribe();

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

多个观察者订阅相同的可观察对象没有错，但是没有什么可以改变流过它们的任何对象。

多个订阅到同一Observable

3 个答案: