Ausführungsreihenfolge für verschachtelte Versprechen

Question

Ich habe über verschachtelte Versprechen gelesen und bin in einem Tutorial auf diese Codierungsherausforderung gestoßen. Kann jemand die Ausführungsreihenfolge dieses Codes erklären?

new Promise((resolve) => {
    neues Versprechen((res) => {
        console.log("c");
        auflösen(3);
        res(2);
    }).then((response) => console.log(response))
}).then((res) => console.log(res));

Ich habe diesen Code ausgeführt und die Ausgabe war:

c
2
3

Aber ich habe erwartet, dass die Ausgabe wie folgt aussieht:

c
3
2

Weil das äußere Versprechen zuerst gelöst wird und dann das innere Versprechen später gelöst wird.

Answer 1

除了Nicholas的答案之外，你可能被标识符'res'的重复使用所困扰。在内部Promise中的第一次使用是作为回调函数，它将值2返回给Promise。 最后一行中的第二次使用是在不同的作用域中，并且用作外部Promise的.then()方法的参数名。 如果你将最后一行中的'res'替换为'outerPromiseResult'，可能会有所帮助，以澄清事情。

Answer 2

简而言之，这是因为您调用.then的顺序。

new Promise((resolve) => {
    new Promise((res) => {
        console.log("c");
        resolve(3);
        res(2);

在上面的代码中，我们进入了外部构造函数，它立即调用外部函数。然后创建内部Promise，调用内部函数。内部函数记录“c”，然后将外部Promise解析为3，然后将内部Promise解析为2。

所以此时我们有2个已解析的Promise，但没有尝试使用它们的代码。

}).then((response) => console.log(response))

完成构造内部Promise后，我们在内部Promise上调用.then。由于Promise已解析，这会排队一个微任务来运行。

}).then((res) => console.log(res));

完成构造外部Promise后，我们在外部Promise上调用.then。由于Promise已解析，这会排队一个微任务来运行。

现在我们已经完成了所有同步代码的运行。调用堆栈为空，微任务开始运行。这些按照先进先出的顺序执行，所以与内部Promise相关的微任务首先运行，记录2。然后运行剩余的微任务，记录3。