我对 new Promise((resolve, reject) => {[loop]}) 阻塞而 Promise.resolve().then([loop]) 不是阻塞感到困惑

Question

我有三个使用 console.time 内置函数的基准测试（beforeBenchmark、benchmark 和 afterBenchmark）。

两个代码完全相同。不过区别在于JS Promises的构造API.

第一个包含 Promise resolve 中的循环，第二个包含 Promise then 中的循环。

我不确定为什么第三个 console.log("after loop") 需要更长的时间才能完成，我将其设计为异步的。感谢您花时间阅读本文。

承诺解决

在循环之前
基准测试前：0.836 毫秒
循环后
基准测试后：40.987 毫秒
基准：41.202 毫秒

然后承诺

在循环之前
基准测试前：1.122 毫秒
循环后
基准测试后：2.872 毫秒
基准：43.705 毫秒

我查看了 Stack Overflow，但找不到与此相关的任何答案。

第一种承诺

console.time("beforeBenchmark");
console.time("benchmark");
console.time("afterBenchmark");
console.log("before loop");
console.timeEnd("beforeBenchmark");

let i = 0;

let promise = new Promise(( resolve, reject ) =>
{
    while (i < 10000000)
    {

        i++;
    }

    resolve();

}).then(() =>
{    
    console.timeEnd("benchmark")

});

console.log("after loop");
console.timeEnd("afterBenchmark");

结果

before loop
beforeBenchmark: 0.836ms
after loop
afterBenchmark: 40.987ms
benchmark: 41.202ms

第二种承诺

console.time("beforeBenchmark");
console.time("benchmark");
console.time("afterBenchmark");
console.log("before loop");
console.timeEnd("beforeBenchmark");
let i = 0;

let promise = Promise.resolve().then(() =>
{
    while (i < 10000000)
    {
        i++;
    }

    console.timeEnd("benchmark")
});


console.log("after loop");
console.timeEnd("afterBenchmark");

结果

before loop
beforeBenchmark: 1.122ms
after loop
afterBenchmark: 2.872ms
benchmark: 43.705ms

Answer 1

Promise 构造函数 运行是同步的。如果 new Promise(... 中有阻塞代码，该代码将运行（并阻塞）在构造的 Promise 运行下的下一行之前。这就是为什么你的第一个片段有 afterBenchmark: 40.987ms.

另一方面，.then回调只会运行一旦当前事件循环被清除（一旦所有同步代码完成运行ning) - 就像 setTimeout(fn, 0)（不完全一样，因为 setTimeout 将运行在 下一个 事件循环的迭代，而不是在当前循环的末尾，但它非常相似）。因此，第二个代码中的 afterBenchmark 在 then 具有运行之前被记录，在阻塞循环具有运行.

之前

我对 new Promise((resolve, reject) => {[loop]}) 阻塞而 Promise.resolve().then([loop]) 不是阻塞感到困惑

I am confused about new Promise((resolve, reject) => {[loop]}) is blocking while Promise.resolve().then([loop]) is not

javascript

asynchronous

node.js

promise

es6-promise

承诺解决

然后承诺

第一种承诺

结果

第二种承诺

结果