Detailed introduction to event loop (EventLoop) in node.js (with code)-JS Tutorial-php.cn

Detailed introduction to event loop (EventLoop) in node.js (with code)

不言

Release： 2018-08-20 09:53:22

Original

1512 people have browsed it

This article brings you a detailed introduction to the event loop (EventLoop) in js (with code). It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Preface

Before learning eventloop, we need to review the single thread and asynchronousness of js.
Although js is single-threaded, it is processed accordingly in the browser and Node. Such as web workers (worker threads) in browsers and child_process (child processes) in Node. Their emergence has facilitated the decomposition of large amounts of computation.

Event loop

When the process starts, Node will create a tick loop. Each tick loop uses the internal observer to see if there are events that need to be processed, and if so, take them out. The event and its related callback function are executed. After execution, it enters the next loop. If there is no more, it exits the process.

Eventloop in the browser

Put asynchronous events in the worker thread in the browser to avoid blocking the rendering of the main thread 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;)

Copy after login

It can be seen from the results that the three types of asynchronous processing do not block the execution of the main thread code, and ajax, fetch, and setTimeout execute callback functions according to the order in which the code processing ends.

Eventloop in Nodejs

The event loop in Node is executed according to the priority of the observer, process.nextTick -> setTimeout -> setImmediate# in the same loop ##

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('正常执行')

Copy after login

Summary

The execution characteristics of the event loop stem from the use of a single thread, away from multi-thread deadlock, state synchronization and other problems; the use of asynchronous to keep a single thread away from blocking, to make better use of the CPU.

Related recommendations:

Details on the JavaScript event loop mechanism - Lecture 2

In-depth understanding of Node. js event loop and callback function

The above is the detailed content of Detailed introduction to event loop (EventLoop) in node.js (with code). For more information, please follow other related articles on the PHP Chinese website!