RxJs 中的 mapTo 有什么意义？

Question

我正在阅读 mapTo

的 文档，但我根本不明白该运算符存在的意义。我明白它的作用，但下面的两行应该产生相同的结果。

const outcome = "bzzz";
const result1 = source.map(a => outcome);
const result2 = source.mapTo(outcome);

然而，RxJ 的创建者选择通过添加额外的方法来增加复杂性。这似乎毫无意义，所以我怀疑它的内容比表面上看到的更多。

针对这种特定情况有专门的操作员有什么意义？

Answer 1

map

和

mapTo

之间的区别

• map

  源代码

• mapTo

  源代码

乍一看，我们可以看到

map

接受一个回调函数

function map<T, R>(project: (value: T, index: number) => R, thisArg?: any)

而

mapTo

接受 静态值

function mapTo<R>(value: R)

因此，一个明显的区别是

map

的回调函数可以根据提供的参数生成一个值。

mapTo

的情况并非如此，您只需提供一个值，该值将始终传递给链中的下一个订阅者。如果你愿意的话，

mapTo(value)

可以被认为是

map(() => value)

我们也可以从源代码中推断出这一点：

// `mapTo`
() => subscriber.next(value)

// `map`; `project` is the provided callback function
() => subscriber.next(project.call(thisArg, value, index++));

但是你可能不想这样做，当你可以直接使用值时为什么要调用函数呢？

一些用例

一个用例可能是当您有 NgRx 效果并且您希望在发生某些情况时返回相同的非动态操作。

createEffect(
  () => this.actions.pipe(
    /* some logic here... */
    mapTo(staticAction('a message here')),
  )
);

另一种情况，可能看起来不太实用，是当你想模拟一些传入的请求时：

merge(
  timer(300).pipe(mapTo("req#1")),
  timer(600).pipe(mapTo("req#2")),
  timer(100).pipe(mapTo("req#3")),
  timer(900).pipe(mapTo("req#4")),
).pipe(
  /* some complicated logic here... */
)

无论如何，至少从我的角度来看，该运算符的目的是表明您想要传递静态值，即不依赖于先前订阅者的数据的值。

Answer 2

mapTo

实际上只是为特定映射场景提供便利，其中：

1. 输出不依赖于可观测源的发射
2. 输出将始终是相同的静态值

第二点需要注意，因为如果目标值随时间变化，

map(a => target)

和

mapTo(target)

之间的输出会有差异：

• map(a => outcome)

  - 将返回“结果”的当前值（可能有不同的结果）

• mapTo(outcome)

  - 将返回“结果”的第一个发出值（每次都有相同的结果）

let outcome = 0;
// change 'outcome' every second
interval(1000).pipe(tap(n => outcome = n * 2)).subscribe();

const source = interval(1000).pipe(take(4));

source.pipe(map(a => outcome));  // 0, 2, 4, 6
source.pipe(mapTo(outcome));     // 0, 0, 0, 0

StackBlitz 演示

Answer 3

只需访问 mapto 并继续尝试其他解决方案:)