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

Question

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 中，str 参数的类型是从返回string 的前一个map 正确推断的。我很好奇打字稿是如何推断第二个地图运算符中的类型的。

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

Answer 1

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

看着pipe overloads

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> 类型是指一个函数，它的单个参数是 T 类型的 Observable 并且其返回类型 也是 A 类型的 Observable：

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

我们也来看看map's signature

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

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

所以，如果你有

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

src$ 将是一个 observable，其类型 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

其中T 是Observable 的推断类型（即在本例中来自map 提供的fn）。