原文: https://rxjs-dev.firebaseapp.com/guide/v6/migration 转载地址: https://segmentfault.com/a/1190000014956260 节选
建议TypeScript开发人员使用rxjs-tslint来重构import路径。 RxJS团队设计了以下规则来帮助JavaScript开发人员重构import路径:
import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';
import { map, filter, scan } from 'rxjs/operators';
import { webSocket } from 'rxjs/webSocket';
import { ajax } from 'rxjs/ajax';
import { TestScheduler } from 'rxjs/testing';
请按照如下步骤将您的链式操作替换为管道操作:
注意:由于与Javascript保留字冲突,以下运算符名字做了修改:do -> tap, catch -> catchError, switch -> switchAll, finally -> finalize
import { map, filter, catchError, mergeMap } from 'rxjs/operators';
// Rxjs5写法,操作符链
source
.map(x => x + x)
.mergeMap(n => of(n + 1, n + 2)
.filter(x => x % 1 == 0)
.scan((acc, x) => acc + x, 0)
)
.catch(err => of('error found'))
.subscribe(printResult);
// Rxjs写法,需要用pipe包一下所有的操作符
source.pipe(
map(x => x + x),
mergeMap(n => of(n + 1, n + 2).pipe(
filter(x => x % 1 == 0),
scan((acc, x) => acc + x, 0),
)),
catchError(err => of('error found')),
).subscribe(printResult);
注意我们在以上代码中嵌套使用了pipe()。 Ben Lesh在ng-conf 2018上解释了为什么我们应该使用管道操作符。
Observable.if and Observable.throw Observable.if已被iif()取代,Observable.throw已被throwError()取代。您可使用rxjs-tslint将这些废弃的成员方法修改为函数调用。
代码示例如下:
OBSERVABLE.IF > IIF() // deprecated Observable.if(test, a
);
// use instead
iif(test, a
); OBSERVABLE.ERROR > THROWERROR() // deprecated Observable.throw(new Error());
//use instead
throwError(new Error());
根据迁移指南,以下方法已被弃用或重构:
import { merge } from 'rxjs/operators';
a$.pipe(merge(b$, c$));
// becomes
import { merge } from 'rxjs';
merge(a$, b$, c$);
import { concat } from 'rxjs/operators';
a$.pipe(concat(b$, c$));
// becomes
import { concat } from 'rxjs';
concat(a$, b$, c$);
import { combineLatest } from 'rxjs/operators';
a$.pipe(combineLatest(b$, c$));
// becomes
import { combineLatest } from 'rxjs';
combineLatest(a$, b$, c$);
import { race } from 'rxjs/operators';
a$.pipe(race(b$, c$));
// becomes
import { race } from 'rxjs';
race(a$, b$, c$);
import { zip } from 'rxjs/operators';
a$.pipe(zip(b$, c$));
// becomes
import { zip } from 'rxjs';
zip(a$, b$, c$);
RxJS 6带来了一些重大改变,但是通过添加rxjs-compat软件包可以缓解这一问题,该软件包允许您在保持v5代码运行的同时逐渐迁移。对于Typescript用户,其他中包括大多数Angular开发人员,tslint提供了大量的自动重构功能,使转换变得更加简单。
任何升级与代码修改都会引入一些bug到代码库中。因此请务必测试您的功能以确保您的终端用户最终接受到相同的质量体验。
个人备注,现在网上大部分教程还是rxjs5的,rxjs6变化还是蛮大的,学习时候要留意区别。