为什么 then 回调中的这个循环比异步 function 中的循环更快？

Question

While I was playing with TS for learning purposes, I discovered that a then callback takes less than an async function with await. Here are my code snippets:

Code with async/await:

 const asyncCodeBlocker = async function(){ console.log("notAsync") await Promise.resolve(); console.time("async"); let i = 0; while (i < 1000000000) { i++; } console.timeEnd("async"); return 'billion loops done with async'; } asyncCodeBlocker().then(v => {console.log(v)}) console.log("mainStack")

result:

notAsync
mainStack
async: 2.464s
billion loops done with async

Code with nested promise:

 const promiseCodeBlocker = function(){ console.log("notAsyncInPromise") return Promise.resolve().then(() => { console.time("promise"); let i = 0; while (i < 1000000000) { i++; } console.timeEnd("promise"); return 'billion loops done with nested promise'; }) } promiseCodeBlocker().then(v => {console.log(v)}) console.log("mainStack")

result:

notAsyncInPromise
mainStack
promise: 497.627ms
billion loops done with nested promise

Why is this happening?

Answer 1

The original code was written in TypeScript but it was edited and overwritten after posting the question by a community member in JS to be able to run the snippets.

It turned out that the behavior was caused by my TS configuration. I had compiler option "target" set to es5 . After changing its value to es6 I managed to obtain the same results for both snippets.

Original code and results:

Code with async/await:

const asyncCodeBlocker: () => Promise<any> = async function(){
    console.log("notAsync")
    await Promise.resolve();
    console.time("async");
    let i = 0;
    while (i < 1000000000) { i++; }
    console.timeEnd("async");
    return 'billion loops done with async';
}

asyncCodeBlocker().then(v => {console.log(v)})

console.log("mainStack")

result:

notAsync
mainStack
async: 2.464s
billion loops done with async

Code with nested promise:

const promiseCodeBlocker: () => Promise<any> = function(){
    console.log("notAsyncInPromise")
    return Promise.resolve().then(() => {
        console.time("promise");
        let i = 0;
        while (i < 1000000000) { i++; }
        console.timeEnd("promise");
        return 'billion loops done with nested promise';
    })
}

promiseCodeBlocker().then(v => {console.log(v)})

console.log("mainStack")

result:

notAsyncInPromise
mainStack
promise: 497.627ms
billion loops done with nested promise