一、Pomise.all的使用

常见使用场景 : 多个异步结果合并到一起

Promise.all可以将多个Promise实例包装成一个新的Promise实例。用于将多个Promise实例,包装成一个新的Promise实例。

1.它接受一个数组作为参数。

2.数组可以是Promise对象,也可以是其它值,只有Promise会等待状态改变。

3.当所有的子Promise都完成,该Promise完成,返回值是全部值的数组。

4.如果有任何一个失败,该Promise失败,返回值是第一个失败的子Promise的结果。

Promise.all([p1,p2,p3])

先举例之前我们 如果有多个异步请求,但是最终用户想要得到的是  多个异步结果合并到一起,用之前代码举例

 console.log('start');
var result1,result2="";
//settimeout 模拟异步请求1
setTimeout(() => {
result1="ok1"
}, 2000);
//settimeout 模拟异步请求2
setTimeout(() => {
result1="ok2"
}, 3000);
//等待 异步1 异步2结果
var tempInterval= setInterval(()=>{
if(result1&&result2){
console.log('data result ok ,,, clearInterval')
clearInterval(tempInterval);
}
},100)

使用Promise.all来解决 ,上代码

let p1 = new Promise((resolve, reject) => {
resolve('成功了')
}) let p2 = new Promise((resolve, reject) => {
resolve('success')
}) let p3 = Promse.reject('失败') Promise.all([p1, p2]).then((result) => {
console.log(result) //['成功了', 'success']
}).catch((error) => {
console.log(error)
}) Promise.all([p1,p3,p2]).then((result) => {
console.log(result)
}).catch((error) => {
console.log(error) // 失败了,打出 '失败'
})
二、Pomise.race的使用

类似于Promise.all() ,区别在于 它有任意一个返回成功后,就算完成,但是 进程不会立即停止

常见使用场景:把异步操作和定时器放到一起,如果定时器先触发,认为超时,告知用户

let p1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('成功了')
}, 2000);
}) let p2 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('success')
}, 5000);
}) Promise.race([p1, p2]).then((result) => {
console.log(result) //['成功了', 'success']
}).catch((error) => {
console.log(error)
})

Promise.all和Promise.race区别,和使用场景的更多相关文章

  1. 理解Promise.all,Promise.all与Promise.race的区别,如何让Promise.all在rejected失败后依然返回resolved成功结果

     壹 ❀ 引 我在 es6入门4--promise详解 这篇文章中有详细介绍Promise对象的用法,文章主题更偏向于对于Promise概念的理解与各方法基本使用介绍:而世上一个比较有趣的问题就是,即 ...

  2. Promise原理讲解 && 实现一个Promise对象 (遵循Promise/A+规范)

    1.什么是Promise? Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一 2.对于几种常见异步编程方案 回调函数 事件监听 发布/ ...

  3. ES6---new Promise()讲解,Promise对象是用来干嘛的?

    ES6---new Promise()讲解,Promise对象是用来干嘛的? :https://blog.csdn.net/Wbiokr/article/details/79490390

  4. list set map区别及适用场景

    list与Set.Map区别及适用场景   1.List,Set都是继承自Collection接口,Map则不是 2.List特点:元素有放入顺序,元素可重复 ,Set特点:元素无放入顺序,元素不可重 ...

  5. session,cookie,sessionStorage,localStorage的区别及应用场景

    session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...

  6. Java内存的 静态方法和实例方法的区别及使用场景

    注意:变量指基本数据类型非对象,局部变量不能被静态修饰 1.(静态)成员变量存放在data segment区(数据区),字符串常量也存放在该区 2.非静态变量,new出来的对象存放在堆内存,所有局部变 ...

  7. 【转】ArrayList与LinkedList的区别和适用场景

    ArrayList 优点:ArrayList是实现了基于动态数组的数据结构,因为地址连续,一旦数据存储好了,查询操作效率会比较高(在内存里是连着放的). 缺点:因为地址连续,当要插入和删除时,Arra ...

  8. 转载>>C# Invoke和BeginInvoke区别和使用场景

    转载>>C# Invoke和BeginInvoke区别和使用场景 一.为什么Control类提供了Invoke和BeginInvoke机制? 关于这个问题的最主要的原因已经是dotnet程 ...

  9. java 常用集合list与Set、Map区别及适用场景总结

     转载请备注出自于:http://blog.csdn.net/qq_22118507/article/details/51576319                  list与Set.Map区别及 ...

  10. hibernate与mybatis的区别和应用场景

    mybatis 与 hibernate 的区别和应用场景(转) 1    Hibernate : 标准的ORM(对象关系映射) 框架: 不要用写sql, sql 自动语句生成: 使用Hibernate ...

随机推荐

  1. echarts 图例显示到右边

    原: legend: { data:['同龄普通孩子','已具备技能','已泛化技能','已掌握技能','学习中'] }, 改: legend: { data:['同龄普通孩子','已具备技能','已 ...

  2. A2D JS框架 - AOP封装

    AOP在js中的实现,先看看用法吧: var A2D = $.noConflict();//不要误会,此乃我自己写的A2D框架,非jQuery function fn1(name, age) { co ...

  3. C#使用ILGenerator动态生成函数

    游戏服务器里面总是有一大堆的配置文件需要读取, 而且这些配置文件的读取: * 要不然做成弱类型的, 就是一堆字符串或者数字, 不能看出来错误(需要重新检测一次) * 要不然做成强类型的, 每种类型都需 ...

  4. mysql 库 行 列的 操作使用

    -----------------------------------------------------------------------------时间不等你,下一刻,全是新的.每一刻都让它变得 ...

  5. ajax成功后XML 解析错误:格式不佳

    就是Ajax发送请求后,意图回显数据时会出现这个错误,貌似chrome浏览器不会报用火狐能看到: 可能的原因有两个,就是后台应该返回一个json格式的字符串,但是你返回的是浏览器看不懂的,也就是返回格 ...

  6. Python入门-格式化输出

    需求:将用户的姓名.年龄.工作.爱好 ,然后打印成以下格式: ------------ Info of Tom ------ Name : Tom Age : 22 Job : Teacher Hob ...

  7. Comet OJ 热身赛(K题)principal(括号匹配问题+stack模拟)

    principal 已经提交 已经通过 23.66% Total Submission:131 Total Accepted:31 题目描述 阿尔比恩王国潜伏着代号白鸽队''的一群间谍.在没有任务的时 ...

  8. Jenkins部署net core小记

    作为一个不熟悉linux命令的neter,在centos下玩Jenkins真的是一种折磨啊,但是痛并快乐着,最后还是把demo部署成功!写这篇文章是为了记录一下这次部署的流程,和心得体会. 网上很多资 ...

  9. 【问题解决方案】editplus中批量将ANSI转换为utf-8

    来自一个用editplus写java程序但是上传到GitHub里中文乱码的故事 大致步骤: editplus全部打开之后(打开为何种编码不重要): (全部打开是指在左下方的文件列表选中-->右击 ...

  10. Linux 典型应用之服务管理

    crontab 定时任务 用户所建立的crontab文件中,每一行都代表一项任务,每行的每个字段代表一项设置,它的格式共分为六个字段,前五段是时间设定段,第六段是要执行的命令段,格式如下: minut ...