主题需要 RxJS6 asObservable()？答案

【问题标题】：RxJS6 asObservable() needed on a Subject?主题需要 RxJS6 asObservable()？
【发布时间】：2020-03-24 19:43:18
【问题描述】：

什么时候需要 asObservable() 在主题（例如 BehaviorSubject）上获取主题的 observable？主体本身也可以转换为 Observable。

问题

name1$ 和 name2$ 之间的技术区别是什么？
应该使用哪一个（name1$ 或 name2$）？

代码示例

import { Observable } from 'rxjs/Observable';
import { BehaviorSubject } from 'rxjs';

export class Person {
  private nameSubject: BehaviorSubject<string> = new BehaviorSubject<string>('lorem');

  public get name1$(): Observable<string> {
    return this.nameSubject.asObservable();
  }

  public get name2$(): Observable<string> {
    return this.nameSubject;
  }

  public setName(value: string): void {
    this.nameSubject.next(value);
  }
}

提前感谢您的回答！

【问题讨论】：

使用asObservable() 时，访问next 时会出错。当你进行转换时，你可以将 Observable 转换回一个让我们调用 next 的类型。见：stackblitz.com/edit/rxjs-qhxv2u

标签： javascript typescript rxjs rxjs6

【解决方案1】：

一般情况下，建议仅在 JavaScript 中使用 RxJS 时使用 asObservable()。使用 TypeScript，你可以只使用类型转换，它不会让你调用 next() 等等。

private nameSubject: BehaviorSubject<string> = new BehaviorSubject<string>('lorem');
public nameSubject$: Observable<string> = this.nameSubject;

这是官方推荐的在 TypeScript 中将 Subjects 转换为 Observables 的方法。
详情见https://github.com/ReactiveX/rxjs/pull/2408#issuecomment-282077506。

【讨论】：

【解决方案2】：

asObservable() 创建了一个新的 Observable，它包裹了 Subject，因此被包裹的 observable 没有 next() 方法，以及 complete() 和 error()。我认为它在 JavaScript 中更有意义，其中返回的对象不受其类型的限制。但是在 TypeScript 中你可以通过缩小类型来隐藏这些方法，在大多数情况下应该足够了。您只需告诉返回 Observable 并且 API 的用户不知道它是 Subject；当然可以将其转换回Subject，但这不是 API 应该使用的方式。

另请参阅：When to use asObservable() in rxjs?

【讨论】：

【解决方案3】：

没有太大区别，asObservable() 主要只是阻止您访问观察者方法 - complete、next、error 以防止您意外调用它们

const a = new Subject();
console.log(a.asObservable().next)
// undefined

如果您不使用该特定流作为观察者，最好返回 asObservable() 以确保安全

【讨论】：