正在使用Array.map synchronous内部的异步函数

Question

processImage()是一个异步处理图像的函数。

uploadImage()是一个异步上传镜像的函数。

它们都会返回承诺。

sizes是长度为4的数组。

图片必须经过处理后才能上传。单个大小的上传和处理不能并行进行。

我想要做的是立即一个接一个地启动所有4个处理/上传作业，并让它们一起异步执行。一旦所有4个都完成了，我就会执行一些其他的代码。

由于我将一个异步函数作为参数传递给map，那么其中的await关键字是否会暂停执行，直到第一个图像的处理/上传完成？在这种情况下，这就变成了同步执行。我不明白这里到底发生了什么。如果这段代码确实是同步的，那么如何使其异步呢？

var responses = await Promise.all(sizes.map(async function (size) {
        let processedBuffer = await processImage(buffer, size);
        let response = await uploadImage(processedBuffer.toString('base64'));
        return response;
    }));

//some other code

Answer 1

你的代码是异步的。你可以很容易地自己检查它。

const mockAsyncFn = () =>
    new Promise(resolve => setTimeout(() => resolve(), 2000));

const someAsync = async () => {
    const from = new Date();
    await Promise.all(
        [mockAsyncFn, mockAsyncFn].map(async fn => await fn())
    );
    const to = new Date();
    return to - from;
};

(async () => console.log(await someAsync()))();

结果将是~2秒，而不是4。

Answer 2

async是返回promise的函数的语法糖。

考虑这个简单的例子：

async function ret42() {
   return 42;
}

这相当于：

function ret42() {
   return Promise.resolve(42);
}

在这种观点下，回调中的异步函数是同步的，直到您遇到await (这是.then(() =>的语法糖)。

如果您希望每个函数都到达最后才能执行下一个函数，则必须使用for await，或者只需：

for (const fn of sizes) {
  await fn();
}