async 会破坏执行的顺序吗？

[苦逼码农]

不是应该所异步代码都在同步代码之后执行吗？ 按照这个说法，


"===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===

[苦逼码农]

up 起来，有没有人知道

[苦逼码农]

引用 3 楼 oliver940910 的回复:

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

没有使用的依然在在主栈中，不进入异步队列，比如这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”。

[苦逼码农]

[苦逼码农]

没人帮忙看吗？

[cooljser]

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

[cooljser]

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

[bsnry]

引用 6 楼 oliver940910 的回复:

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

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

[bsnry]

引用 6 楼 oliver940910 的回复:

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

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

[cooljser]

引用 8 楼 bsnry 的回复:

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

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

[漠子凉]

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