Rxjs的使用詳解

這次帶給大家Rxjs的使用詳解，使用Rxjs的注意事項有哪些，下面就是實戰案例，一起來看一下。

一個可觀察物件的執行期間，零個到無限多個next通知被發送。如果Error或Complete通知一旦被發送，此後將不再發送任何值。

可觀察物件嚴格的堅守這個契約，所以，下面的程式碼將不會發送包含數值4的next通知

var observable = Rx.Observable.create(function subscribe(observer) {
observer.next(1);
observer.next(2);
observer.next(3);
observer.complete();
observer.next(4); // Is not delivered because it would violate the contract});

不失為一個好方式的是，使用try/catch語句包裹通知語句，如果捕獲了異常將會發送一個錯誤通知。

var observable = Rx.Observable.create(function subscribe(observer) {try {
observer.next(1);
observer.next(2);
observer.next(3);
observer.complete();
} catch (err) {
observer.error(err); // delivers an error if it caught one}
});

取消訂閱 unsubscribe()

由於可觀察物件的執行可能是無限的(不停地next)，而對於觀察者來說卻往往希望在有限的時間內終止執行，因此我們需要一個API來取消執行。

var observable = Rx.Observable.from([10, 20, 30]);var subscription = observable.subscribe(x => console.log(x));// Later:subscription.unsubscribe ();

在你訂閱了之後，你將會得到一個Subscription對象，它表示正在進行的執行。大膽的去使用unsubscribe()去終止執行吧。

observer觀察者

什麼是觀察者？觀察者是可觀察物件所發送資料的消費者，觀察者簡單而言是一組回呼函數 ， 分別對應一種被可觀察物件發送的通知的類型:next, error和complete。以下是一個典型的觀察者對象的例子:

var observer={next:x=>console.log('Observer got a next value: ' + x),error: err => console.error('Observer got an error: ' + err),complete: () => console.log('Observer got a complete notification')
}

觀察者不過是三個回呼函數組成的對象，每個回調函數分別對應可觀察對象的通知類型。

Subscription訂閱

訂閱物件也可以被放置在一起，因此對訂閱物件的unsubscribe()進行調用，可以對多個訂閱進行取消。做法是:把一個訂閱"加"進另一個訂閱。

var observable1 = Rx.Observable.interval(400);var observable2 = Rx.Observable.interval(300);var subscription = observable1.subscribe(x => console.log('first: ' + x));var childSubscription = observable2.subscribe(x => console.log('second: ' + x));
subscription.add(childSubscription);
setTimeout(() => {// Unsubscribes BOTH subscription and childSubscriptionsubscription.unsubscribe();
}, 1000);

執行之後，我們可以在控制台得到:

second: 0
first: 0
second: 1
first: 1
second: 2

訂閱也有一個remove(otherSubscription)方法,用於解除被add新增的子訂閱。

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

js-xlsx的工具類別庫xlsxUtils的使用詳解

##JS的日常常用函數整合
#

以上是Rxjs的使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！