async/await只是then 的语法糖吗？有什么细微上的不同吗？为什么这两段代码输出不一致？

Question

首先是async/await风格的promise
我理解的流程:

1. 进入 async1(), 在其内部调用 async2()
2. async2()内部没有异步代码，所以执行后会回到await处, 然后将下面的代码console.log('async1 end')注册在微任务队列里
3. async1()流程结束
4. 进入Promise(), 执行resolve(), 执行 then() 注册微任务
5. 同步代码结束，执行微任务队列的回调函数
6. 依次执行 console.log('async1 end')， console.log('promise2')

async function async1() {
  await async2();
  console.log('async1 end');
}

async function async2() {
  return new Promise(resolve => {
    console.log('async2 promise');
    resolve(32); 
    // 这里的同步代码结束后流程会回到调用async2处
    // 然后把下边的 console.log('async1 end') 注册为 微任务吧？
  })
}

async1();

new Promise(resolve => {
  resolve();
}).then(() => {
  console.log('promise2');
})
// 以下是结果
// async2 promise
// promise2
// async1 end

下面这个是我所认为的逻辑上相同的then的写法

function async1() {
  async2().then(() => {
    console.log('async1 end');
  })
}


function async2() {
  return new Promise(resolve => {
    console.log('async2 promise');
    resolve(32);
  })
}

async1();

new Promise(resolve => {
  resolve();
}).then(() => {
  console.log('promise2');
})
// async2 promise
// async1 end
// promise2

为了方便比较，我放在了一张图片里

Answer 1

function async1() {
    return new Promise(function(resolve) {
        resolve(async2().then(function() {
            return new Promise(function(res) {
                res(console.log('async1 promise done'));
            });
        }));
    });
}
function async2() {
    return new Promise(function(resolve) {
        resolve(new Promise(function(re) {
            console.log('async2 promise done');
            re(32);
        }));
    });
}

async1();

new Promise(function(resolve) {
    resolve();
}).then(function() {
    console.log('promise2 done');
});

Answer 2

你忽略了一个问题async function本身就是一个返回Promise，不同版本的node对async2的这种情况处理不太一致。

以typescript playground作为标的，转换后的写法应该是：

function async1() {
  async2().then(() => {
    console.log('async1 end');
  })
}


function async2() {
  return new Promise(resolve => {
    resolve(new Promise(resolve => {
    console.log('async2 promise');
    resolve(32);
  }))
  })
}

async1();

new Promise(resolve => {
  resolve(1);
}).then(() => {
  console.log('promise2');
})

Answer 3

1. async/await只是then的语法糖吗?
   async/await = Generator + Promise

2. 为什么这两段代码输出不一致？
   async1转成Promise格式后相当于相当于：

   function async1() {
     new Promise(resolve => {
      resolve(async2());
     })
     .then(() => {
    console.log('async1 end');
     })
   }

   题主顺便再看看resolve函数的执行逻辑就知道原因了