Rxjsの使い方を詳しく解説

今回はRxjsの使い方について詳しく説明します。Rxjsを使用する際の注意点は何ですか?実際の事例を見てみましょう。

監視可能な

オブジェクト の実行中に、ゼロから無限の次の通知が送信されます。エラーまたは完了通知が一度送信されると、それ以降は値は送信されません。

Observable オブジェクトはこの規約に厳密に準拠しているため、次のコードは値 4 を含む次の通知を送信しません

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 unsubscribe()

監視可能なオブジェクトの実行は無限（次の連続）になる可能性があるため、オブザーバーは制限時間内に実行を終了したいことが多いため、実行をキャンセルするための API が必要です。

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

サブスクライブすると、進行中の実行を表す Subscription オブジェクトを取得します。実行を終了するには、遠慮せずに unsubscribe() を使用してください。

オブザーバー

オブザーバーとは何ですか?オブザーバーは、監視可能なオブジェクトによって送信されるデータのコンシューマーです。簡単に言えば、オブザーバーは一連の

コールバック関数 であり、それぞれが監視可能なオブジェクトによって送信される通知のタイプ (次、エラー、および完了) に対応します。以下は、典型的なオブザーバー オブジェクトの例です。

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')
}

オブザーバーは、3 つのコールバック関数

array で構成される単なるオブジェクトです。各コールバック関数は、監視可能なオブジェクトの通知タイプに対応します。

Subscription

Subscription オブジェクトは一緒に配置することもできるため、1 つの 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

Subscription には、add によって追加されたサブスクリプションをキャンセルするために使用される、remove(otherSubscription) メソッドもあります。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイト

その他の関連記事に注目してください。

関連書籍:

js-xlsxのツールライブラリxlsxUtilsの使い方を詳しく解説

JSの日常よく使う機能を統合

以上がRxjsの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。