[rxjs] rxjs에서 asObservable ()을 언제 사용합니까?

Subject.prototype.asObservable ()을 사용하는 경우

이것의 목적은 API에서 주제의 “관찰자 측”이 유출되는 것을 방지하는 것입니다. 기본적으로 사람들이 결과 관찰 대상에 “다음”으로 들어가는 것을 원하지 않을 때 누출 된 추상화를 방지합니다.

예

(참고 : 이것은 실제로 이와 같은 데이터 소스를 Observable로 만드는 방법이 아닙니다. 대신 new Observable생성자를 사용해야합니다 . 아래 참조).

const myAPI = {
  getData: () => {
    const subject = new Subject();
    const source = new SomeWeirdDataSource();
    source.onMessage = (data) => subject.next({ type: 'message', data });
    source.onOtherMessage = (data) => subject.next({ type: 'othermessage', data });
    return subject.asObservable();
  }
};

이제 누군가가 관찰 가능한 결과를 얻으면 결과에 가치를 둘 myAPI.getData()수 없습니다 next.

const result = myAPI.getData();
result.next('LOL hax!'); // throws an error because `next` doesn't exist

new Observable()하지만 일반적으로을 사용해야합니다.

위의 예에서 우리는 의도하지 않은 것을 만들고있을 것입니다. 하나를 들어, getData()대부분의 관찰 가능한처럼 게으른 것이 아니라,이 기본 데이터 소스 만들 것 SomeWeirdDataSource즉시 (그리고 아마도 몇 가지 부작용). 이것은 또한 당신 retry이나 repeat결과적으로 관찰 가능한 것이 당신이 생각하는 것처럼 작동하지 않을 것임을 의미합니다.

다음과 같이 Observable 내에서 데이터 소스 생성을 캡슐화하는 것이 좋습니다.

const myAPI = {
  getData: () => return new Observable(subscriber => {
    const source = new SomeWeirdDataSource();
    source.onMessage = (data) => subscriber.next({ type: 'message', data });
    source.onOtherMessage = (data) => subscriber.next({ type: 'othermessage', data });
    return () => {
      // Even better, now we can tear down the data source for cancellation!
      source.destroy();
    };
  });
}

위의 코드를 사용하면 RxJS의 기존 연산자를 사용하여 관찰 가능 항목 위에 “게으르지 않게”만드는 것을 포함한 모든 동작을 구성 할 수 있습니다.