资讯专栏INFORMATION COLUMN

事件循环(EventLoop)的学习总结

hizengzeng / 2003人阅读

摘要:事件循环当进程启动时,会创建一个循环,每个循环通过内部的观察者来查看是否有事件需要处理,如果有就取出事件和它相关的回调函数去执行,执行完以后就进入下一个循环,如果不再有就退出进程。

前言
在学习eventloop之前,我们需要复习一下js的单线程和异步。
虽说js是单线程的,但是在浏览器和Node中都做了相应的处理。如浏览器中的web workers(工作线程),Node中的child_process(子进程)。它们的出现对大量计算的分解起到了促进作用。
事件循环

当进程启动时,Node会创建一个tick循环,每个tick循环通过内部的观察者来查看是否有事件需要处理,如果有就取出事件和它相关的回调函数去执行,执行完以后就进入下一个循环,如果不再有就退出进程。

浏览器中的eventloop
在浏览器中把异步事件放到工作线程中,避免阻塞主线程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("进程结束")
从结果可以看出三种异步处理不阻塞主线程代码的执行,而ajax、fetch、setTimeout根据代码处理结束的先后来执行回调函数。
Nodejs中的eventloop
Node中的事件循环根据观察者的优先级来执行,同一个循环内的process.nextTick -> setTimeout -> setImmediate
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("正常执行")
总结
事件循环的执行特点,源于利用单线程,远离多线程死锁、状态同步等问题;利用异步让单线程远离阻塞,以更好的使用CPU。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108360.html

相关文章

  • 事件循环(EventLoop)学习总结

    摘要:事件循环当进程启动时,会创建一个循环,每个循环通过内部的观察者来查看是否有事件需要处理,如果有就取出事件和它相关的回调函数去执行,执行完以后就进入下一个循环,如果不再有就退出进程。 前言 在学习eventloop之前,我们需要复习一下js的单线程和异步。虽说js是单线程的,但是在浏览器和Node中都做了相应的处理。如浏览器中的web workers(工作线程),Node中的child_...

    lentoo 评论0 收藏0
  • 事件循环(EventLoop)学习总结

    摘要:事件循环当进程启动时,会创建一个循环,每个循环通过内部的观察者来查看是否有事件需要处理,如果有就取出事件和它相关的回调函数去执行,执行完以后就进入下一个循环,如果不再有就退出进程。 前言 在学习eventloop之前,我们需要复习一下js的单线程和异步。虽说js是单线程的,但是在浏览器和Node中都做了相应的处理。如浏览器中的web workers(工作线程),Node中的child_...

    ninefive 评论0 收藏0
  • Netty 框架总结「ChannelHandler 及 EventLoop

    摘要:随着状态发生变化,相应的产生。这些被转发到中的来采取相应的操作。当收到数据或相关的状态改变时,这些方法被调用,这些方法和的生命周期密切相关。主要由一系列组成的。采用的线程模型,在同一个线程的中处理所有发生的事。 「博客搬家」 原地址: 简书 原发表时间: 2017-05-05 学习了一段时间的 Netty,将重点与学习心得总结如下,本文主要总结ChannelHandler 及 E...

    VioletJack 评论0 收藏0
  • Javascript 事件循环event loop

    摘要:现实中是这样的执行结果为结果告诉我们,是单线程没错,不过不是逐行同步执行。搜索了很多官方个人博客得到了一堆词引擎主线程事件表事件队列宏任务微任务,彻底懵逼。。。以此规则不停的执行下去就是我们所听到的事件循环。 都知道javascript是单线程,那么问题来了,既然是单线程顺序执行,那怎么做到异步的呢? 我们理解的单线程应该是这样的,排着一个个来,是同步执行。 showImg(https...

    Miyang 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<