Introduction détaillée à la boucle d'événement (EventLoop) dans node.js (avec code)

Cet article vous apporte une introduction détaillée à la boucle d'événement (EventLoop) en js (avec code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Préface

Avant d'apprendre eventloop, nous devons revoir le thread unique et l'asynchronisme de js.
Bien que js soit monothread, il est traité en conséquence dans le navigateur et Node. Tels que les Web Workers (threads de travail) dans les navigateurs et child_process (processus enfants) dans Node. Leur émergence a facilité la décomposition de grandes quantités de calcul.

Boucle d'événements

Lorsque le processus démarre, Node créera une boucle de ticks utilise l'observateur interne pour voir si des événements doivent être traités et si. alors, supprimez-les. L'événement et sa fonction de rappel associée sont exécutés. Après l'exécution, il entre dans la boucle suivante. S'il n'y en a plus, il quitte le processus.

Eventloop dans le navigateur

Placez les événements asynchrones dans le thread de travail du navigateur pour éviter de bloquer le rendu de l'interface utilisateur du thread principal

  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;)

Il ressort des résultats que les trois types de traitement asynchrone ne bloquent pas l'exécution du code du thread principal, et ajax, fetch et setTimeout exécutent des fonctions de rappel selon l'ordre dans lequel le traitement du code se termine.

eventloop dans Nodejs

La boucle d'événement dans Node est exécutée en fonction de la priorité de l'observateur process.nextTick -> setTimeout -> >

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

Résumé

Les caractéristiques d'exécution de la boucle d'événements découlent de l'utilisation d'un seul thread, loin des blocages multithreads, de la synchronisation d'état et d'autres problèmes ; utilisation de l'asynchrone pour éloigner le thread unique. Blocage pour une meilleure utilisation du processeur.

Recommandations associées :

Détails du mécanisme de boucle d'événements JavaScript - Conférence 2

Compréhension approfondie de Boucle d'événement Node.js et fonction de rappel

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript node.js ajax 回调函数 循环 线程 多线程 主线程 JS 事件 异步 ui

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn