RxJS 承诺可观察 - TypeScript

简介

RxJS 是一个使用 Observables 处理异步和基于事件的程序的库。它提供了一个类似于数组的 API，用于处理事件序列，并且非常适合处理异步事件。

Promise 也是一种处理异步操作的方式，但是与 Observables 不同的是，Promise 仅处理单个值，而 Observables 可以处理任意数量的值，并且可以处理任意类型的值。

在 TypeScript 中，RxJS 的类型定义已经非常完备，并且可以通过类型检查来减少一些错误。

Observables

Observables 是 RxJS 中最重要的概念之一，它在概念上类似于 Promise。但是与 Promise 只能产生单个值不同，Observables 可以产生多个值，并且可以发出错误和完成，与 Promise 只能有成功和失败两种状态不同。

Observables 可以使用各种方式创建，比如通过传递一个回调函数来创建：

import { Observable } from 'rxjs';

const numbers$ = new Observable(observer => {
  observer.next(1);
  observer.next(2);
  observer.next(3);
  observer.complete();
});

上面的代码创建了一个 Observable，它依次发出数字 1、2 和 3，并完成。$ 符号是一个约定，用于标识这是一个 Observable 对象。

Operators

RxJS 中还有一个重要的概念是 Operators，它们用于对 Observables 进行操作，例如转换、扁平化或筛选。Operators 可以链式调用。

示例代码如下：

import { from } from 'rxjs';
import { map, filter } from 'rxjs/operators';

const numbers$ = from([1, 2, 3, 4, 5]);

numbers$
  .pipe(
    filter(n => n % 2 === 0),
    map(n => n * 2)
  )
  .subscribe(x => console.log(x));

上面的代码首先创建一个 Observable，它依次发出数字 1 到 5。然后，它使用 filter 和 map Operators 对这个 Observable 进行操作，并且只保留偶数并将它们乘以 2。最后，它将结果输出到控制台。

Subject

Subject 是 RxJS 中的另一个重要概念。它可以同时充当 Observable 和 Observer 的角色，并且可以被多个订阅者同时订阅。

示例代码如下：

import { Subject } from 'rxjs';

const subject = new Subject<number>();

subject.subscribe({
  next: x => console.log(`A: ${x}`)
});

subject.next(1);

subject.subscribe({
  next: x => console.log(`B: ${x}`)
});

subject.next(2);

上面的代码先创建了一个 Subject 对象，并分别对它进行了两次订阅。然后，它向 Subject 发送了两个数字，它们分别被两个订阅者接收并输出。

总结

RxJS 是一个非常强大的库，它可以处理各种异步和事件驱动的编程场景，使代码更加简洁和可读。在 TypeScript 中使用 RxJS，可以通过类型检查来避免一些错误，使代码更加健壮。