js【深度解析】代码的执行顺序

JavaScript中的代码执行顺序通常遵循以下规则：

1. 同步代码会按照它们在代码中出现的顺序执行。
2. 异步代码（如回调函数，setTimeout，setInterval，Promises，async/await）会在当前JavaScript执行"栈"（synchronous stack）执行完之后再执行。
3. 事件循环（Event Loop）处理异步操作，如I/O、用户界面的事件、setTimeout等。

以下是一些示例代码，演示了这些执行顺序：

// 同步代码
console.log('同步代码1');
console.log('同步代码2');
 
// 异步代码
setTimeout(function() {
  console.log('异步代码1');
}, 0);
 
new Promise((resolve) => {
  console.log('异步代码2');
  resolve();
})
.then(() => {
  console.log('Promise中的同步代码');
})
.then(() => {
  console.log('另一个Promise中的同步代码');
});
 
// async/await 使得异步代码看起来像同步代码（但实际上是异步的）
async function asyncFunction() {
  console.log('async/await同步代码');
  await new Promise((resolve) => {
    console.log('await前的同步代码');
    resolve();
  });
  console.log('await后的同步代码');
}
asyncFunction();
 
// 结果输出顺序将是：
// 同步代码1
// 同步代码2
// 异步代码2
// async/await同步代码
// await前的同步代码
// Promise中的同步代码
// 另一个Promise中的同步代码
// await后的同步代码
// 异步代码1

在上述代码中，首先执行的是同步代码，然后是Promise中的代码，接着是async/await中的代码。最后，当事件循环执行到setTimeout时，它将异步代码放入执行"队列"（task queue），在同步代码执行完毕后再执行。