理解JavaScript中的事件轮询
原文:http://www.ruanyifeng.com/blog/2014/10/event-loop.html
为什么JavaScript是单线程
JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。那么,为什么JavaScript不能有多个线程呢?
JavaScript的单线程,与它的用途有关。作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。比如,假定JavaScript同时有两个线程,一个线程再某个DOM节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准?
所以,为了避免复杂性,从一诞生,JavaScript就是单线程,这已经成了这门语言的核心特征,将来也不会改变。
为了利用多核CPU的计算能力,HTML5提出Web Worker标准,运行JavaScript脚本创建多个线程,但是子线程完全受主线程控制,且不得操作DOM。所以,这个新标准并没有改变JavaScript单线程的本质。
任务队列
单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务。如果前一个任务耗时很长,后一个任务就不得不一直等着。多线程可以将任务放到不同的线程中去处理。CPU的调度单位是线程,它会在不同的线程之间切换,任务是隶属于线程的。
如果一个线程中,任务排队是因为计算量大,CPU忙不过来,倒也算了。但是很多时候CPU处理一个线程时是闲着的,因为IO设备(输入输出设备)很慢(比如Ajax操作从网络读取数据),不得不等结果出来,任务才能往下执行。
JavaScript语言的设计者意识到,这时主线程完全可以不管IO设备,挂起处于等待中的任务,先运行排在后面的任务。等到IO设备返回了结果,再回头,把挂起的任务继续执行下去。
于是,所有任务可以分成两种,一种是同步任务,另一种是异步任务。同步任务指的是,在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务;异步任务指的是,不进入主线程、而进入“任务队列”的任务,只有“任务队列”通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行。
注:在理解上面的内容时,不要将CPU处理其他进程(比如QQ等)考虑进来,上面内容是针对CPU处理一个线程来说的。在一个单线程中(比如一个页面加载过程中的js处理),会包含许多任务。在任务很多的情况下,想要不被阻塞,采用的方案是异步任务+事件轮询。多线程是将任务分到不同的线程中去,各个线程内部采用的是同步任务。
事件和回调函数
“任务队列”是事件队列(也可以理解成消息队列),表示相关的异步任务可以进入“执行栈”了。主线程读取“任务队列”,这个过程是循环不断的。
“任务队列”中的事件,除了IO设备的事件以外,还包括一些用户产生的事件(比如鼠标点击、页面滚动等等)。只要指定过回调函数,这些事件发生时就会进入“任务队列”,等待主线程读取。
异步任务必须指定回调函数,当主线程开始执行异步任务,就是执行对应的回调函数。
Event Loop
主线程从“任务队列”中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为Event Loop(事件轮询)。

上图中,主线程运行的时候,产生堆(heap)和栈(stack)。只要栈中的代码执行完毕,主线程就会去读取“任务队列”,依次执行那些事件所对应的回调函数。
任务队列中的任务,是“回调函数”指定的,然后通过事件触发添加进去的,是一种异步任务。而在页面初始化时,主线程执行的任务是同步任务。
需要注意的是,setTimeout()只是将事件插入了"任务队列",必须等到当前代码(执行栈)执行完,主线程才会去执行它指定的回调函数。要是当前代码耗时很长,有可能要等很久,所以并没有办法保证,回调函数一定会在setTimeout()指定的时间执行。
Node.js的Event Loop
Node.js也是单线程的Event Loop,但是它的运行机制不同于浏览器环境。

根据上图,Node.js的运行机制如下。
- V8引擎解析JavaScript脚本
- 解析后的代码,调用Node API
- libuv库负责Node API的执行。它将不同的任务分配给不同的线程,形成一个Event Loop,以异步的方式将任务的执行结果返回给V8引擎。
- V8引擎再将结果返回给用户
除了setTimeout和setInterval这两个方法,Node.js还提供了另外两个与“任务队列”有关的方法:process.nextTick和setImmediate。它们可以帮助我们加深对“任务队列”的理解。
process.nextTick方法可以在当前“执行栈”的尾部,下一次Event Loop(主线程读取“任务队列”)之前,触发回调函数。也就是说,它指定的任务总是发生在所有一般任务之前。
setImmediate方法则是在当前“任务队列”的尾部添加事件,也就是说,它指定的任务总是在下一次Event Loop时执行,这与setTimeout很像。
理解JavaScript中的事件轮询的更多相关文章
- 理解Nodejs中的事件轮询机制
我在看<了不起的Nodejs>一书,阻塞与非阻塞IO那一章我来回看了N遍,然后...还是没太看懂..于是我找到了这篇日志,写的是真的有点好啊..潸然泪下.. 原文:http://www.r ...
- 理解Node.js的事件轮询
前言 总括 : 原文地址:理解Node.js的事件轮询 Node小应用:Node-sample 智者阅读群书,亦阅历人生 正文 Node.js的两个基本概念 Node.js的第一个基本概念就是I/O操 ...
- node.js中的事件轮询Event Loop
任务队列/事件队列 "任务队列"是一个事件的队列,IO设备完成一项任务,就在"任务队列"中添加一个事件,表示相关的异步任务可以进入"执行栈" ...
- 深入理解javascript中的事件循环event-loop
前面的话 本文将详细介绍javascript中的事件循环event-loop 线程 javascript是单线程的语言,也就是说,同一个时间只能做一件事.而这个单线程的特性,与它的用途有关,作为浏览器 ...
- 理解Javascript中的事件绑定与事件委托
最近在深入实践js中,遇到了一些问题,比如我需要为动态创建的DOM元素绑定事件,那么普通的事件绑定就不行了,于是通过上网查资料了解到事件委托,因此想总结一下js中的事件绑定与事件委托. 事件绑定 ...
- 再次理解javascript中的事件
一.事件流的概念 + 事件流描述的是从页面中接收事件的顺序. 二.事件捕获和事件冒泡 + 事件冒泡接收事件的顺序:
- 理解JavaScript中的事件流
原文地址:http://my.oschina.net/sevenhdu/blog/332014 目录[-] 事件冒泡 事件捕获 DOM事件流 当浏览器发展到第四代时(IE4和Netscape Comm ...
- 理解JavaScript中的事件路由冒泡过程及委托代理机制
当我用纯CSS实现这个以后.我开始用JavaScript和样式类来完善功能. 然后,我有一些想法,我想使用Delegated Events (事件委托)但是我不想有任何依赖,插入任何库,包括jQuer ...
- 理解javascript中的事件模型
javascript中有两种事件模型:DOM0,DOM2.而对于这两种的时间模型,我一直不是非常的清楚,现在通过网上查阅资料终于明白了一些. 一. DOM0级事件模型 DOM0级事件模型是早期的事件 ...
随机推荐
- 读javascript高级程序设计02-变量作用域
一. 延长作用域链 有些语句可以在作用域前端临时增加一个变量对象,该变量对象在代码执行完成后会被移除. ①with语句延长作用域. function buildUrl(){ var qs=" ...
- 使用Markdown+Pandoc+LaTex+Beamer制作幻灯片
概述 为什么使用markdown? mardown是一种轻量级的标记语言,语法简单,可读性好,并且容易转化成其他格式的文档, 在技术文档撰写中得到越来越广泛的应用.相信大家对markdown都有一定了 ...
- transform scale
- Quartus ii 12.0 和ModelSim 10.1 SE安装及连接
quartus ii 10.0后就没有自带的仿真软件,每次写完一个VerilogHDL都想简单仿真一下,结果发现没有了自带仿真软件.这时候就需要第三方仿真软件ModelSim 10.1 SE. Qua ...
- 1、Android Bitmap详细介绍
import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io ...
- 【php常用】常用函数啥的
1.intval() 把变量转换成整数类型 2.trim() 去除字符串两边空格or 加上参数是去除该参数 3.array_values() 函数返回一个包含给定数组中所有键值的数组,但不保留键名 ...
- UVA 10407 差分思想的运用
就是每两项相减,肯定能被模数整除. #include <iostream> #include <cstring> #include <cstdio> #includ ...
- tensorflow1
特征: 1 灵活 2 可移植性 3 和研究/生产联系 4 自动求导 5 语言选择:python,严谨的c++接口:未来扩展更多 6 最大性能化
- java导出excel报错:getOutputStream() has already been called for this response
对于java导出excel报错的问题,查了很多都说是在使用完输出流以后调用以下两行代码即可 out.clear(); out = pageContext.pushBody(); 但这也许是页面上输出时 ...
- Spring概况
1. Spring是什么 Spring是一个开源框架,为了解决企业应用开发的复杂性而创建的,但现在已经不止于企业应用. 是一个轻量级的控制反转(IoC)和面向切面(AOP)的容器框架. ——从大小与开 ...