异步和多重等待 |调用堆栈暂停

Question

我正在使用承诺和异步函数。我知道，在异步函数内部，如果有await out JS引擎将挂起正在进行的调用堆栈的函数调用并等待等待的承诺解决。 问题是，让我先放代码：-

const pr= new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done")},5000);
});

const pr2= new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done222222")},10000);
});

async function handelPr(){
    const val1 = await pr;
    console.log("Hello");
    console.log(val1);

    const val2 = await pr2;
    console.log("Hello-->");
    console.log(val2);
}
handelPr()

我可以在控制台上看到，5秒后pr解析并返回值，但又过了5秒pr2返回值，但我认为在pr返回值后，pr2应该花费10秒而不是当前场景的5秒。我假设整个过程应该花费 15 秒而不是 10 秒。这些承诺是并行执行的吗？或者我在事件循环中遗漏了一些东西？ 另一件事是，如果我将 pr 的时间更改为 10 秒，将 pr2 更改为 5 秒，那么也需要 5 秒。 请让我理解，提前谢谢！！..

Answer 1

这些 Promise 是并行执行的吗？ 是的。代码执行并没有在 pr 上停止。 pr 和 pr2 几乎同时被调用

Answer 2

“这些 Promise 是并行执行的吗？”

是的。

这些操作在您创建时开始执行，此处：

const pr= new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done")},5000);
});

const pr2= new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done222222")},10000);
});

因此，这些超时是立即创建的（并且足够接近同时，任何差异都无关紧要）。 一个将从现在起 5 秒后执行，另一个将从现在起 10 秒后执行。

所以当你等待第一个时：

const val1 = await pr;

将等待 5 秒过去。 但这 5 秒对于 both Promise 来说已经过去了。 所以第二个只剩下 5 秒了：

const val2 = await pr2;

---

要实现您正在寻找的功能，您可以将

pr

和

pr2

更改为创建和返回 Promise 的函数。 例如：

const pr = () => new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done")},5000);
});

const pr2 = () => new Promise((res,rej) =>{
    setTimeout(()=>{res("promise Execution done222222")},10000);
});

这些代码行不会立即创建（并随后调用）Promise，直到实际调用这些函数。 当您想等待它们时，调用函数并等待结果：

async function handelPr(){
    const val1 = await pr(); // <-- here
    console.log("Hello");
    console.log(val1);

    const val2 = await pr2(); // <-- and here
    console.log("Hello-->");
    console.log(val2);
}
handelPr()

在这种情况下，直到调用

pr2

时才会创建来自

pr2()

的 Promise，这将是在最初的 5 秒之后。