[解決済み] RXJS observableの.pipe()と.subscribe()の違いについて
2023-07-17 19:51:39
質問
最近、私は
.pipe()
の中では値を返すことができますが
.subscribe()
.
この2つの方法の違いは何ですか?
例えば、この関数があったとして、それを「deposit」と呼ぶことにします。この関数は、口座の残高を返すことになっていますが、このようにすると
deposit(account, amount){
return this.http.get('url')
.subscribe(res => {
return res;
}
}
observableを返すので、こうすると。
deposit(account, amount){
return this.http.get('url')
.pipe(
map(res => {
return res;
});
);
}
予想通り口座残高が返ってきます。
では、なぜ?
どのように解決するのか?
この
pipe
メソッドは、観測可能な演算子を連結するためのものであり
subscribe
は、observableを活性化し、放出された値を聞くためのものです。
は
pipe
メソッドが追加され
ウェブパック
を使用して、最終的な JavaScript のバンドルから未使用の演算子を削除できるようになりました。これにより、より小さなファイルのビルドが容易になります。
例えば、私がこの関数を持っている場合、それを「deposit」と呼ぶことにします。
deposit(account, amount){ return this.http.get('url') .subscribe(res => { return res; } }
observableを返します。
それは返されるものではありません。これは
Subscription
を呼び出したときに作成されたオブジェクトを返します。
Subscribe
.
とすると
deposit(account, amount){ return this.http.get('url') .pipe( map(res => { return res; }); ); }
予想通り口座残高が返ってきます。
それは返されるものではありません。それは
Observable
を使い
map
演算子を使っています。この例の map 演算子は何もしません。
関連
-
[解決済み】event.stopPropagationとevent.preventDefaultの違いは何ですか?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] let "と "var "の使い分けは?
-
[解決済み] callとapplyの違いは何ですか?
-
[解決済み] Bowerとnpmの違いは何ですか?
-
[解決済み] JavaScriptのnullとundefinedの違いは何ですか?
-
[解決済み] コンストラクタとngOnInitの違いについて
-
[解決済み】PromiseとObservablesの違いは何ですか?
-
[解決済み] jqueryでdivの要素がオーバーフローしていないかチェックする
-
[解決済み] bootstrap のポップオーバーがすべての要素の上に表示されない
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] ジェスト あるクラスの特定のメソッドをモックする方法
-
[解決済み] 配列からオブジェクトを生成する
-
[解決済み] reactのrender関数でdynamic hrefを作成するには?
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] オブジェクトの配列からReactコンポーネントをレンダリングする
-
[解決済み] AngularJS - ngRepeatフィルタリングされた結果の参照を取得する方法
-
[解決済み] JSHintの'+'前の改行不良の説明
-
[解決済み] Javascript の parseInt() で先頭のゼロを削除する。
-
[解決済み] Chrome拡張機能:popup.htmlを強制終了させる