Question

我对此代码的输出感到困惑。输出为4 3 2 1

我如何理解流程？

new Promise(resolve => {
    resolve(1);
    Promise.resolve().then(() => console.log(2));
    console.log(4);
}).then( t => console.log(t) );
console.log(3);

Answer 1

我认为关键的理解是

始终同步调用new Promise回调（在通话期间）
始终异步调用then回调（稍后）

所以这里的各个同步步骤依次为：

new Promise(resolve => { // begins creating a promise
    resolve(1);          // fulfills the promise
    Promise.resolve()    // creates a promise
    .then(…);            // registers a callback
    console.log(4);      // logs the first line
})                       // finishes the promise creation
.then(…);                // registers a callback
console.log(3);          // logs the second line

当注册回调时，then检查承诺是否已经解决，这就是这种情况（对于两个承诺），它会立即通过将它们放在队列中来安排它们。理论上，这个队列定义了一个特定的顺序，在实践中你应该忽略它（即同时安排的事情可以按任何顺序发生）。如果您想要特定订单，请始终建立明确的承诺链，而不是依赖内部排队。

所以这里我们有两个预定的项目：

() =>          // the first item is called with undefined (result of `Promise.resolve()`)
console.log(2) // logs the third line

t =>           // the second item is called with 1 (from the `resolve(1)` call)
console.log(t) // logs the fourth line

Answer 2

这取决于Promise的实施方式。 Promises/A+ specification需要使用then注册的功能，比如说later，asynchronously。

因此，考虑resolve(1)执行以下操作可以帮助您推理上述评论中解释的asynchronous流程：

将promise的值设为1
注册setTimeout(later, 0)，以后是该功能由then

setTimeout是关键，它只是将其推送到event-loop而不是立即执行，因为规范是这样说的。

所以，

new Promise(resolve => {
    resolve(1);
    Promise.resolve().then(() => console.log(2));
    console.log(4);
}).then( t => console.log(t) );
console.log(3);

console.log(2) // gets queued
console.log(4) // gets executed
console.log(3) // gets executed
console.log(1) // gets queued

您可以在此处查看相关问题：Why do Promise libraries use event loops?

什么是javascript中的承诺执行顺序？

2 个答案: