JS事件循环(Event Loop)

119 阅读1分钟

Event Loop (事件循环)概念

同步和异步任务分别进入不同的执行环境,同步的进入主线程,即主执行栈,异步的进入任务队列。
主线程内的任务执行完毕为空,会去任务队列读取对应的任务,推入主线程执行。 上述过程的不断重复就是我们说的 Event Loop (事件循环)。

任务:宏任务和微任务

1、MacroTask(宏任务)
script全部代码、setTimeout、setInterval、I/O、UI Rendering。

2、MicroTask(微任务)
Process.nextTick(Node独有)、Promise

例子:

// async/await 在底层转换成了 promise 和 then 回调函数

console.log('script start')

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

setTimeout(function() {
  console.log('setTimeout')
}, 0)

new Promise(resolve => {
  console.log('Promise')
  resolve()
})
  .then(function() {
    console.log('promise1')
  })
  .then(function() {
    console.log('promise2')
  })

console.log('script end')

/* 输出结果
script start
async2 end
Promise
script end
async1 end
promise1
promise2
setTimeout
*/
```js