javascript - 将异步等待与 Array.map 结合使用

Question

给定以下代码:

var arr = [1,2,3,4,5];

var results: number[] = await arr.map(async (item): Promise<number> => {
        await callAsynchronousOperation(item);
        return item + 1;
    });

产生以下错误:

TS2322: Type 'Promise<number>[]' is not assignable to type 'number[]'. Type 'Promise<number> is not assignable to type 'number'.

我该如何解决？如何让 async await 和 Array.map 协同工作？

Answer 1

这里的问题是你试图await一系列 promise 而不是 promise 。这不符合您的预期。

当对象传递给await时不是 promise ，await只是立即按原样返回值，而不是尝试解析它。所以既然你通过了await这里是一个(Promise 对象的)数组而不是 Promise，await 返回的值就是那个数组，类型为 Promise<number>[] .

您可能想要做的是调用 Promise.all在 map 返回的数组上为了在 await 之前将其转换为单个 Promise正在阅读它。

根据MDN docs for Promise.all :

The Promise.all(iterable) method returns a promise that resolveswhen all of the promises in the iterable argument have resolved, orrejects with the reason of the first passed promise that rejects.

所以在你的情况下:

var arr = [1, 2, 3, 4, 5];

var results: number[] = await Promise.all(arr.map(async (item): Promise<number> => {
    await callAsynchronousOperation(item);
    return item + 1;
}));

这将解决您在此处遇到的特定错误。

根据您要执行的操作，您也可以考虑使用 Promise.allSettled , Promise.any , 或 Promise.race 而不是 Promise.all ，虽然在大多数情况下(几乎肯定包括这个)Promise.all将是您想要的那个。