• Promise和Observable的映射


    前言

    1. promise解决了嵌套地狱的问题,Observable解决了promise只有一个结果,和不可以取消的问题。
    2. 使用的是rxjs6版本。
    3. 这篇文章是方便使用Observable的API替换Promise的API。

    正常用法

    promise
    .then(result => {})
    .catch(error => {})
    .finally(() => {});
    
    observable.subscribe(
      result => {},
      error => {},
      ()=>{},  // finally
    );
    

    then

    promise
    .then(result => {})
    .then(result => {})
    .then(result => {})
    
    import { concat } from 'rxjs';
    concat(observable0,observable1,observable2).subscribe(
      result => {},
      error => {},
      ()=>{},  // finally
    );
    
    // promise
    this.getOne().then(data => {
      // 这里返回另外一个Promise
      return this.getTwo(data);
    }).then(data => {
      console.log(data);  // 这里打印第二个Promise的值
      return this.getThree(data);
    }).then(data => {
      console.log(data); // 这里打印第三个Promise的值
    });
    
    // Observable
    import { forkJoin, Observable,from,pipe } from 'rxjs';
    import { retryWhen, map, mergeMap } from 'rxjs/operators';
    
    from(this.getOne)
    .pipe(
        mergeMap(oneData => {
            console.log(oneData)
            return from(this.getTwo)
        }),
        mergeMap(twoData => {
            console.log(twoData)
            return from(this.getThree)
        })
    )
    .subscribe(threeData => {
        console.log(threeData)
        ...
    })
    

    Promise.all

    Promise.all([promise0, promise1]).then((result)=>{});
    
    import { forkJoin } from 'rxjs';
    forkJoin([observable0, observable1]).subscribe(result => {});
    

    Promise.race

    Promise.race([promise0, promise1]).then((result)=>{});
    
    import { race } from 'rxjs/observable/race';
    race([observable0, observable1]).subscribe(result => {});
    
  • 相关阅读:
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
  • 原文地址:https://www.cnblogs.com/samwu/p/11517540.html
Copyright © 2020-2023  润新知