Promise和Observable的映射

Stella981
• 阅读 805

前言

  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 => {});
点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Easter79 Easter79
3年前
swap空间的增减方法
(1)增大swap空间去激活swap交换区:swapoff v /dev/vg00/lvswap扩展交换lv:lvextend L 10G /dev/vg00/lvswap重新生成swap交换区:mkswap /dev/vg00/lvswap激活新生成的交换区:swapon v /dev/vg00/lvswap
待兔 待兔
4个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
Jacquelyn38 Jacquelyn38
3年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Stella981 Stella981
3年前
JavaScript中Promise 使用、原理以及实现过程
1.什么是Promisepromise是目前JS异步编程的主流解决方案,遵循Promises/A方案。2.Promise原理简析(1)promise本身相当于一个状态机,拥有三种状态pendingfulfilledrejected一个promise对象初始化时
Stella981 Stella981
3年前
JS 苹果手机日期显示NaN问题
问题描述newDate("2019122910:30:00")在IOS下显示为NaN原因分析带的日期IOS下存在兼容问题解决方法字符串替换letdateStr"2019122910:30:00";datedateStr.repl
Stella981 Stella981
3年前
Javascript 中的神器——Promise
_摘要:_ 回调函数真正的问题在于他剥夺了我们使用return和throw这些关键字的能力。而Promise很好地解决了这一切回调函数真正的问题在于他剥夺了我们使用return和throw这些关键字的能力。而Promise很好地解决了这一切Promise概念所谓Promise,就是ES6原生提供的一个
Easter79 Easter79
3年前
Twitter的分布式自增ID算法snowflake (Java版)
概述分布式系统中,有一些需要使用全局唯一ID的场景,这种时候为了防止ID冲突可以使用36位的UUID,但是UUID有一些缺点,首先他相对比较长,另外UUID一般是无序的。有些时候我们希望能使用一种简单一些的ID,并且希望ID能够按照时间有序生成。而twitter的snowflake解决了这种需求,最初Twitter把存储系统从MySQL迁移
Stella981 Stella981
3年前
JOptionPane修改图标
1.在Linux平台下.JOptionPane会显示Java默认的图标,在window平台不显示图标,如何替换这个图标了?2JOptionPane.setIcon(Icon)修改的是内容区域的icon,而不是左上角的Icon.所以需要通过修改Jdialog/Frame的图标来达到修改默认图标的问题.3.代码:if(JOptio
Python进阶者 Python进阶者
10个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这