[javascript] 하나의 Observable 시퀀스가 ​​방출하기 전에 다른 시퀀스가 ​​완료 될 때까지 기다리는 방법은 무엇입니까?

여기에 또 다른 것이 있지만 더 간단하고 직관적입니다 (또는 약속에 익숙하다면 적어도 자연 스럽습니다), 접근 방식입니다. 기본적으로 Observable.create()랩핑 one및 two단일 Observable로 사용하여 Observable을 만듭니다 . 이것은 Promise.all()작동 방식과 매우 유사합니다 .

var first = someObservable.take(1);
var second = Observable.create((observer) => {
  return first.subscribe(
    function onNext(value) {
      /* do something with value like: */
      // observer.next(value);
    },
    function onError(error) {
      observer.error(error);
    },
    function onComplete() {
      someOtherObservable.take(1).subscribe(
        function onNext(value) {
          observer.next(value);
        },
        function onError(error) {
          observer.error(error);
        },
        function onComplete() {
          observer.complete();
        }
      );
    }
  );
});

그래서 여기서 무슨 일이 일어나고 있습니까? 먼저 새로운 Observable을 생성합니다. 에 전달 된 함수는 Observable.create()적절하게 이름이 지정 onSubscription되며 관찰자 (에 전달한 매개 변수에서 빌드 됨 subscribe())로 전달되며 , 이는 새 Promise를 만들 때 단일 객체 resolve와 유사 하고 reject결합됩니다. 이것이 우리가 마법을 작동시키는 방법입니다.

에 onSubscription 첫 번째 Observable을 구독합니다 (위의 예에서는라고 함 one). 우리가 처리하는 방법 next과 error당신에게 달려 있지만, 제 샘플에 제공된 기본값은 일반적으로 적절할 것입니다. 그러나 complete이벤트를 받으면 one이제 완료 되었음을 의미 합니다. 다음 Observable을 구독 할 수 있습니다. 따라서 첫 번째 Observable이 완료된 후 두 번째 Observable을 발사합니다.

두 번째 Observable에 제공된 예제 옵저버는 매우 간단합니다. 원래,second 이제 twoOP에서 예상 하는 것처럼 작동합니다. 더 구체적으로, 오류가 없다고 가정 second하여 someOtherObservable(때문에 take(1)) 에서 내 보낸 첫 번째 값만 내 보낸 다음 완료됩니다.

예

실생활에서 작동하는 내 예제를 보려면 복사 / 붙여 넣기 할 수있는 전체 작동 예제가 있습니다.

var someObservable = Observable.from([1, 2, 3, 4, 5]);
var someOtherObservable = Observable.from([6, 7, 8, 9]);

var first = someObservable.take(1);
var second = Observable.create((observer) => {
  return first.subscribe(
    function onNext(value) {
      /* do something with value like: */
      observer.next(value);
    },
    function onError(error) {
      observer.error(error);
    },
    function onComplete() {
      someOtherObservable.take(1).subscribe(
        function onNext(value) {
          observer.next(value);
        },
        function onError(error) {
          observer.error(error);
        },
        function onComplete() {
          observer.complete();
        }
      );
    }
  );
}).subscribe(
  function onNext(value) {
    console.log(value);
  },
  function onError(error) {
    console.error(error);
  },
  function onComplete() {
    console.log("Done!");
  }
);

콘솔을 보면 위의 예가 인쇄됩니다.

1

6

끝난!