JS Array 的 map() 方法和 await 一起使用

15 篇文章 1 订阅
1 篇文章 0 订阅

在对数组进行逐个异步操作的时候,想使用 await 来获取操作后的数组,尝试了如下的写法:

const resArr = await arr.map(async (item)=>{
	const resItem = await query(item) // 异步操作
	return resItem
})

这样的写法是不正确的,因为 Array.prototype.map() 不会返回一个 Promise。
可以采用如下的写法

const promiseArr = arr.map((item)=>{
	return query(item)
})
const resArr = Promise.all(promiseArr)
JavaScript 数组的 `map` 方法本身并不支持直接使用 `async`。`map` 方法是用于数组的映射转换操作,它会基于原数组的每个元素执行一个回调函数,并返回一个新的数组,其中包含每个回调函数的返回值。 然而,你可以在 `map` 方法的回调函数中使用 `async` 函数。这样做可以在回调函数中执行异步操作,并使用 `await` 关键字等待异步操作的结果。 以下是一个示例: ```javascript const array = [1, 2, 3, 4, 5]; const asyncMap = async (arr) => { const result = await Promise.all(arr.map(async (item) => { // 在回调函数中执行异步操作 const transformedItem = await someAsyncFunction(item); return transformedItem; })); return result; }; // 调用 asyncMap 函数 asyncMap(array) .then((result) => { console.log(result); // 输出经过异步操作转换后的新数组 }) .catch((error) => { console.error(error); }); ``` 在上述示例中,我们定义了一个名为 `asyncMap` 的异步函数,它接受一个数组作为参数。在 `asyncMap` 函数内部,我们使用 `Promise.all` 方法来等待所有回调函数的异步操作完成,并返回处理后的结果。 在 `map` 方法的回调函数中,我们使用了 `async` 关键字定义了一个异步函数,并在其中执行了异步操作。通过使用 `await` 关键字,我们等待异步操作的结果,然后将其返回。 需要注意的是,`map` 方法返回的是一个新的数组,该数组的元素是经过回调函数处理后的结果。如果回调函数中返回的是一个 `Promise` 对象,那么最终返回的数组中会包含这些 `Promise` 对象。如果你需要获取异步操作的结果,可以使用 `Promise.all` 或者其他适当的方法处理返回的数组。 希望以上解答对你有帮助!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值