js array.map() 的回调用async函数怎么写比较简单?

let items = [1, 2, 3];
items = items.map(async (v) => {
  await asyncMultiplyByTwo(v);
});

如果直接这样写,会得到一组Promise对象

必须这样写才能获取正确结果:

let items = [1, 2, 3];
items = await Promise.all(
  items.map(async (v) => {
    await asyncMultiplyByTwo(v);
  })
);

我服了,map()函数用async居然这么麻烦,有什么更好的写法,或者库来用?

回复
阅读 765
2 个回答

你说得对,但是

其实第二种写法,map 里面的函数不需要 async/await,反正都是返回 Promise

let items = [1, 2, 3];
items = await Promise.all(
  items.map((v) => {
    asyncMultiplyByTwo(v)
  })
);

不过,我推测你原先的写法还有别的问题,就是没有 return,而 asyncMultiplyByTwo 看起来是一个返回入参两倍的异步函数,它的返回值应该是需要的

const items = [1, 2, 3];
items = await Promise.all(
  items.map(async (v) => {
    return await asyncMultiplyByTwo(v)
  })
);

或者

items = await Promise.all(
  items.map((v) => {
    return asyncMultiplyByTwo(v))
  }
);

或者

items = await Promise.all(
  items.map((v) => asyncMultiplyByTwo(v))
);

那这么看来不需要箭头函数

items = await Promise.all(items.map(asyncMultiplyByTwo))

这么看来是不是没有那么复杂?

如果你还是不喜欢每次都写 Promise.all,大可以封装一下(不过不推荐扔到原型链上)

const mapAll = (array, fn) => Promise.all(array.map(fn))

用的时候

mapAll(items, asyncMultiplyByTwo)

用for await of咯,(与promise.all执行方式不一致)

没其他更简洁的方式,或者你可以自己封装一下

function AwaitAllRequest<T extends any[]>(paramList: T, request: (...args) => Promise<unknown>) {
  return Promise.all(paramList.map(async (v) => await request(v)))
}
推荐问题
宣传栏