时间戳

首页 > 解决方案 > 使用多个管道时 RXJS 类型推断如何工作

typescript - 使用多个管道时 RXJS 类型推断如何工作

问题描述

const of = require('rxjs').of;
const map = require('rxjs/operators').map

of(123).pipe(
  map(num => num.toString()),
  map(str => str.substring(0,1)),
).subscribe(console.log);

在map上面的第二个中，参数的类型是从返回 astr的前一个正确推断出来的。我很好奇打字稿是如何推断第二个地图运算符中的类型的。 mapstring

这个 RxJS 是不是很好地设计了代码以便它发生？
还是只是 VS 代码对 RxJS 有特殊的 IntelliSense？

标签： typescriptvisual-studio-coderxjsintellisense

解决方案

我想说这一切都由 RxJS 处理。

看pipe重载

pipe(): Observable<T>;
  pipe<A>(op1: OperatorFunction<T, A>): Observable<A>;
  pipe<A, B>(op1: OperatorFunction<T, A>, op2: OperatorFunction<A, B>): Observable<B>;
  pipe<A, B, C>(op1: OperatorFunction<T, A>, op2: OperatorFunction<A, B>, op3: OperatorFunction<B, C>): Observable<C>;
...

我们可以看到发生了很多事情。

OperatorFunction<T, A>type 指的是一个函数，它的单个参数是一个Observable类型T，它的返回类型也是一个 Observable 类型A：

export interface OperatorFunction<T, R> extends UnaryFunction<Observable<T>, Observable<R>> {}

我们也来看看map的签名

export function map<T, R>(project: (value: T, index: number) => R, thisArg?: any): OperatorFunction<T, R> { ... }

如您所见，它的返回类型将是一个接收可观察对象并返回另一个可观察对象的函数。在这种情况下，返回的 Observable ( )的类型是从提供的投影函数中推断出来的：R(value: T, index: number) => R

所以，如果你有

const src$ = of(1).pipe(map(v => '' + v));

src$将是一个类型为 的可观察T对象string。

这就是为什么类型推断也适用于内部的原因subscribe：

subscribe(next?: (value: T) => void, error?: (error: any) => void, complete?: () => void): Subscription; // Providing callbacks

subscribe(observer?: PartialObserver<T>): Subscription; // Providing an observer object

Observable 的推断类型在哪里T（即map在这种情况下来自 ' 提供的 fn ）。

推荐阅读