前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >async/await实现Promise.all()

async/await实现Promise.all()

原创
作者头像
coldPlayer
发布2023-11-23 22:59:28
1980
发布2023-11-23 22:59:28
举报

一、Promise.all()简介

Promise.all() 方法接收一个 promise 的 iterable 类型(注:Array,Map,Set 都属于 ES6 的 iterable 类型)的输入,并且只返回一个Promise实例,并且输入的所有 promise 的 resolve 回调的结果是一个数组

  • Promise的 resolve 回调执行是在所有输入的 promise 的 resolve 回调都结束,或者输入的 iterable 里没有 promise 了的时候 let a = new Promise((res, rej) => { res(1) }).catch(err => console.log(err)) let b = new Promise((res, rej) => { setTimeout(() => { rej(2) }, 2000) }).catch(err => console.log(err)) let c = new Promise((res, rej) => { res(3) }).catch(err => console.log(err)) const arr = [a, b, c]1、方式一-使用async/await,循环遍历Promise实例对象的数组,并把每个Promise对象的结果放置于一个空数组中。 async function bb() { let arr1 = []; try { for (let i = 0; i < arr.length; i++) { let h = await arr[i] arr1.push(h) } } catch (err) { } return arr1 } bb().then(res => { console.log(res); //[1, undefined, 3] });undefined是因为await只处理成功时resolve(),不处理失败异常,故返回undefined2、方式二该方面类似实现手写Promise.acll(),等await拿到Promise结果然后count加1,知道count的数值等于数值的长度在resolve() const all = (arr) => { return new Promise((resolve, reject) => { let length = arr && arr.length let count = 0 let result = [] if (!arr || arr.length === 0) { resolve(result) } arr.forEach(async (item, index) => { try { const res = await item result[index] = res count++ if (count === length ) { resolve(result) } } catch (err) { reject(err) } }); }) }
  • Promise的 reject 回调执行是只要任何一个输入的 promise 的 reject 回调执行或者输入不合法的 promise 就会立即抛出错误,并且只要有 reject 就会立即抛出的错误信息。二、async/await实现Promise.all()先定义三个Promise实例对象,并放置于一个数组中

三、async/await与Promise.all()结合使用

因为Promise.all()返回的也是Promise,所以await 后面可以跟Promise.all()

代码语言:javascript
复制
         function fn() {
			return new Promise((resolve, reject) => {
				resolve(Math.random())
			})
		}
		async function asyncFunc() {
			let result
			try {
				result = await Promise.all([fn(), fn()])
				console.log(result)
			} catch (err) {
				console.log(err, 'err')
			}
			return result
		}
      asyncFunc().then(res => { console.log(res, 'res') })

我正在参与2023腾讯技术创作特训营第三期有奖征文,组队打卡瓜分大奖!

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、Promise.all()简介
  • 三、async/await与Promise.all()结合使用
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档