RxJS - 最新更新

我们在本教程中使用 RxJS 版本 6。RxJS 通常用于处理响应式编程,并且更常与 Angular、ReactJS 一起使用。 Angular 6 默认加载 rxjs6。

与版本 6 相比,RxJS 版本 5 的处理方式有所不同。如果您将 RxJS 5 更新为 6,代码将会中断。在本章中,我们将了解处理版本更新的方式的不同。

如果您要将 RxJS 更新到 6 并且不想进行代码更改,您也可以这样做,并且必须安装以下软件包。

npm install --save-dev rxjs-compact

此软件包将负责提供向后兼容性,旧代码将与 RxJS 版本 6 配合良好。如果您想进行与 RxJS 6 配合良好的代码更改,以下是需要进行的更改。

运算符、可观察对象、主题的软件包已重组,因此,主要更改涉及导入,并对其进行了解释如下。

运算符的导入

根据版本 5,对于运算符,应包含以下导入语句 −

import 'rxjs/add/operator/mapTo'
import 'rxjs/add/operator/take'
import 'rxjs/add/operator/tap'
import 'rxjs/add/operator/map'

在 RxJS 版本 6 中,导入将如下所示 −

import {mapTo, take, tap, map} from "rxjs/operators"

导入方法以创建可观察对象

按照版本 5,在使用可观察对象时,应包括以下导入方法 −

import "rxjs/add/observable/from";
import "rxjs/add/observable/of";
import "rxjs/add/observable/fromEvent";
import "rxjs/add/observable/interval";

在 RxJS 版本 6 中,导入将如下所示 −

import {from, of, fromEvent, interval} from 'rxjs';

导入 Observables

在 RxJS 版本 5 中,使用 Observables 时,应包含以下导入语句 −

import { Observable } from 'rxjs/Observable'

在 RxJS 版本 6 中,导入将如下所示 −

import { Observable } from 'rxjs'

导入 Subject

在 RxJS 版本 5 中,应包含以下 subject −

import { Subject} from 'rxjs/Subject'

在 RxJS 版本 6 中,导入将如下所示 −

import { Subject } from 'rxjs'

如何在 RxJS 6 中使用运算符?

pipe() 方法 可用于创建的可观察对象。它从版本 5.5 开始添加到 RxJS。现在,使用 pipe(),您可以按顺序同时使用多个运算符。这是 RxJS 版本 5 中使用运算符的方式。

示例

import "rxjs/add/observable/from";
import 'rxjs/add/operator/max'

let list1 = [1, 6, 15, 10, 58, 2, 40];
from(list1).max((a,b)=>a-b).subscribe(x => console.log("最大值为 "+x));

从 RxJS 5.5 版开始,我们必须使用 pipe() 来执行运算符 −

示例

import { from } from 'rxjs';
import { max } from 'rxjs/operators';

from(list1).pipe(max((a,b)=>a-b)).subscribe(x => console.log(
"最大值为 "+x)
);

运算符已重命名

在重组软件包期间,一些运算符被重命名,因为它们与 javascript 关键字冲突或匹配。列表如下 −

操作符 重命名为
do() tap()
catch() catchError()
switch() switchAll()
finally() finalize()
throw() throwError()