时间戳

首页 > 解决方案 > rxjs中switchmap的理解

node.js - rxjs中switchmap的理解

问题描述

我是 rxjs 的新手。我正在尝试了解 switchmap 功能。为了便于理解，我编写了以下代码。

const fun1 = () => {
    return new Promise((resolve, reject) => resolve("Fun1"));
  };
  const fun2 = () => {
    return new Promise((resolve, reject) => resolve("Fun2"));
  };
  const fun3 = () => {
    return new Promise((resolve, reject) => resolve("Fun3"));
  };

  const observer = from(fun()).pipe(
    switchMap((result1) => {
      return from(fun1());
    }),
    switchMap((result2) => { 
      return from(fun2())
    }),
    switchMap((result3) => {
      return from(fun3());
    })
  );
  observer.subscribe(
    (val) => console.log("Val =", val),
    (error) => console.log("Error = ", error),
    () => console.log("Completed")
  );

上面的代码将 Fun3 返回给订阅者。

但我的期望是，如果 fun2() 返回带有“Fun2”字符串的承诺，那么代码不应使用 from(fun3()); 执行 switchmap；并且代码应该向订阅者返回“Fun2。如何在上述代码中实现此功能。

标签： node.jsreactjsangularjsreact-nativerxjs

解决方案

我已经重新编写了您的代码，因此可能更容易理解为什么您总是得到“fun3”。

const fun1 = () => of("Fun1");
const fun2 = () => of("Fun2");
const fun3 = () => of("Fun3");

const observable = from(fun()).pipe(
  switchMap(_ => fun1()),
  switchMap(_ => fun2()),
  switchMap(_ => fun3()),
);

observer.subscribe({
  next: val => console.log("Val =", val),
  error: err => console.log("Error = ", err),
  complete: () => console.log("Completed")
});

首先，请注意我的 switchMaps 是如何忽略他们的输入的？这应该给您一个提示，即忽略前一个 observable 的“返回值”。

switchMap(_ => fun1())是说“只要源 observable 发出一个值（我不在乎这个值是什么），然后订阅由 . 返回的 observable fun1。”

这是另一个例子：

const observable = from(fun()).pipe(
  switchMap(result => result == "Fun2"? of(result) : fun1()),
  switchMap(result => result == "Fun2"? of(result) : fun2()),
  switchMap(result => result == "Fun2"? of(result) : fun3()),
);

现在您有了正在检查中间结果的可观察对象。

  • 第一个结果是fun()发出的任何内容，如果不是"Fun2"，则fun1()调用。
  • 第二个结果是"Fun1"，因为两者都不"Fun2"是，所以fun2()被称为
  • 第三个结果是"Fun2"！啊哈！现在我们返回一个发出"Fun2"而不是调用的 observablefun3()

推荐阅读