node.js의 이벤트 루프(EventLoop)에 대한 자세한 소개(코드 포함)

이벤트루프를 배우기 전에 js의 단일 스레드와 비동기성에 대해 검토해야 합니다.
js는 단일 스레드이지만 브라우저와 Node.js에서는 그에 맞게 처리되었습니다. 브라우저의 웹 작업자(작업자 스레드)와 Node.js의 child_process(하위 프로세스) 등이 있습니다. 이들의 출현은 많은 양의 계산을 분해하는 것을 촉진했습니다.

메인 스레드 UI 렌더링을 차단하지 않도록 브라우저의 작업자 스레드에 비동기 이벤트를 배치합니다

  console.log('进程开始')
  const ajax = new XMLHttpRequest()
  ajax.addEventListener('load', () => {
    console.log('load')
  })
  ajax.addEventListener('loadend', () => {
    if (ajax.readyState == 4 && ajax.status == 200) {
      console.log('ajax success')
  　　　　} else {
      console.log('ajax success')
  　　　　}
  })
  ajax.open('get', 'http://localhost/study/html/vue.js')
  ajax.send()
  setTimeout(() => {
    console.log('setTimeout')
  }, 300)
  fetch('http://localhost/study/html/demo.json',{
    headers: {
      'content-type': 'application/json'
    }
  }).then(res => {
    console.log('fetch')
  })
  let i = 0
  while(i < 10000) {
    i++
  }
  console.log(i)
  console.log(&#39;进程结束&#39;)

setTimeout(() => {
  console.log('setTimeout')
}, 0)
setImmediate(() => {
  console.log('setImmediate1')
  process.nextTick(() => {
    console.log('setImmediate1 插入nextTick')
  })
})
setImmediate(() => {
  console.log('setImmediate2')
})
process.nextTick(() => {
  setTimeout(() => {
    console.log('nextTick1 setTimeout')
  }, 100)
  console.log('nextTick1')
})
process.nextTick(() => {
  console.log('nextTick2')
})
console.log('正常执行')