async 会破坏执行的顺序吗？

Question

不是应该所异步代码都在同步代码之后执行吗？ 按照这个说法，
 "===end1===
===end2==="这两句打印信息在 insertData函数之前被执行啊？ insertData在这两句之后被执行才对啊。
async function openDb(): Promise<void> {
  console.log('===openDb===');
}async function loadDb(): Promise<void> {
  console.log('===loadDb===');
}
async function insertData(person: any): Promise<void> {
  console.log('===enter into insertData===');
  loadDb();
  console.log('===await openDb===');
  await openDb();
  console.log('===after open===');
}console.log('===start===');
insertData({ name: "yika" });
console.log('===end1===');
console.log('===end2===');
以下是执行结果：===start===
===enter into insertData===
===loadDb===
===await openDb===
===openDb===
===end1===
===end2===
===after open===

Answer 1

在执行到openDb()时，因为使用了await，所以会把这个promise放到一个队列中，等待执行。并且此时会重新唤起主线程，即会打印出end1，end2。然后promise队列执行完成，最后打印出after open。
openDb和loadDb的不同就在于，一个使用了await，一个没有使用awati。

Answer 2

没有使用的依然在在主栈中，不进入异步队列，比如这3句红色的，async function insertData(person: any): Promise<void> {
  console.log('===enter into insertData===');
  loadDb();
  console.log('===await openDb===');
  await openDb();我这么理解对否？ 很明显不对。我们看完整的代码： async function insertData(person: any): Promise<void> {
  console.log('===enter into insertData===');
  loadDb();
  console.log('===await openDb===');
  await openDb();
  console.log('===after open===');
}console.log('===start===');
insertData({ name: "yika" });
console.log('===end1===');
console.log('===end2===');
===start===
===enter into insertData===
===loadDb===
===await openDb===
===openDb===
===end1===
===end2===
===after open===如果是await作用====》把函数插入到异步的尾部，按照你的说法，那么console.log('===after open==='); 就应该在主栈中，打印的结果就应该先是： after open， 后是end1, end2，而我们看到的结果却是“先end1, end2, 后after open”。

Answer 3

其实可以这么理解，async和await的作用是将异步函数调用变为同步函数调用。在javascript中，虽然是单线程的，但是也分为执行栈和事件队列，执行栈就是主线程，而事件队列中则存放了异步的执行函数。
再来看这个问题，当函数执行到await openDb()时，此时promise进行实例化，所以会打印出openDb。由于使用了await，所以在openDb()后面的操作会暂时挂起。
然后主线程继续执行，打印出'end1', 'end2'。当openDb()的promise执行完成之后，再执行后面的代码，最后打印出'after open'。

Answer 4

请问 ：await后，也就是 console.log('===after open==='); 这一句是同步调用还是异步调用？ 

Answer 5

我的理解是，await 是挂起该函数中的后续的所有代码，请斧正。仅仅对该函数。

Answer 6

我的理解是，await 是挂起该函数中的后续的所有代码，请斧正。仅仅对该函数。
你的理解是对的，在await之后，函数内的代码都会被挂起，要等待await的函数执行完成后才会执行。

Answer 7

async与普通的异步是一样都是异步任务，既然是异步就肯定会破坏顺序，只是async在破坏顺序的前提在代码视觉上看上去是同步的，
async function index() {
  console.log('第二个打印')
// 这里开始异步
   var data = await new Promise() // data未异步返回值
  // 下面接着可以使用data
console.log(data)
console.log('第四个打印')
}
 console.log('第一个打印')
 index()
console.log('第三个打印')