Rxjs之高级映射操作符

Rxjs之高级映射操作符switchMap, mergeMap,concatMap,exhaustMap.

首先, 高级映射操作符是干什么的呢? 

顾名思义,  他们的作用就是做某种映射,  使用map运算符, 可以获取到输入流, 并从中创建派生的映射输出流, 从输入流到输出流, 是经过某种函数来获取的 .  map操作符就是映射输入observable的值.

concatMap.

使用场景: 实现表单草稿保存功能.

将observable串联 , 按顺序执行.

mergeMap.

并行运行，而不需要等待前一个内部 Observable 完成, 我们有合并 Observable 组合策略！ 与 concat 不同，Merge 不会在订阅下一个 Observable 之前等待 Observable 完成, merge 同时订阅每个合并的 Observable，然后随着多个值随着时间的推移到达，它将每个源 Observable 的值输出到组合结果 Observable。

switchMap.

switchMap 的一个非常常见的用例是搜索 Typeahead。

组合策略：切换。 切换的概念更接近于合并而不是串联，因为我们不等待任何 Observable 终止。但是在切换时，与合并不同，如果一个新的 Observable 开始发出值，我们将在订阅新的 Observable 之前取消订阅之前的 Observable。

查看代码

const searchText$: Observable<string> = 
      fromEvent<any>(this.input.nativeElement, 'keyup')
    .pipe(
        map(event => event.target.value),
        startWith(''),
        debounceTime(400),
        distinctUntilChanged()
    ); 

const lessons$: Observable<Lesson[]> = searchText$
    .pipe(
        switchMap(search => this.loadLessons(search))        
    )
    .subscribe();

function loadLessons(search:string): Observable<Lesson[]> {

    const params = new HttpParams().set('search', search);

    return this.http.get(`/api/lessons/${coursesId}`, {params});
}

exhaustMap.

多次点击保存按钮, 只有在上一次保存功能完成之后才会触发下一次.

switchMap 操作符是预输入场景的理想选择，但在其他情况下，我们想要做的是忽略源 Observable 中的新值，直到前一个值被完全处理。

 

相关知识借鉴与知乎https://zhuanlan.zhihu.com/p/389784619.