从Event Loop谈JS的运行机制
这里主要是结合Event Loop
来谈JS代码是如何运行的。 事件循环对于我们平时开发可以说是特别重要,可以让我们写出更好的代码。
到这里相信我们已经知道了JS引擎是单线程,而且这里会用到前面说的的几个概念:(如果不是很理解,可以看看前几节)
JS引擎线程 【执行js代码】
事件触发线程【轮训】
定时触发器线程【倒计时结束了,要执行回调方法了】
然后再理解一个概念:
JS分为同步任务和异步任务
同步任务都在主线程上执行,形成一个
执行栈 【执行栈后面咱们会详细的介绍,栈的特点是后进先出】
主线程之外,事件触发线程管理着一个
任务队列
,只要异步任务有了运行结果,就在任务队列
之中放置一个事件【回调方法】。一旦
执行栈
中的所有同步任务执行完毕(此时JS引擎空闲),系统就会读取任务队列
,将可运行的异步任务添加到可执行栈中,开始执行。
看到这里,应该就可以理解了:为什么有时候setTimeout推入的事件不能准时执行?因为可能在它推入到事件列表时,主线程还不空闲,正在执行其它代码,
所以自然有误差。
再重复一下:
主线程运行时会产生执行栈,
栈中的代码调用某些api时,它们会在事件队列中添加各种事件(当满足触发条件后,如ajax请求完毕)
而栈中的代码执行完毕,就会读取事件队列中的事件,去执行那些回调方法。
如此循环
注意,总是要等待栈中的代码执行完毕后才会去读取事件队列中的事件
从Event Loop谈JS的运行机制的更多相关文章
- Node.js event loop 和 JS 浏览器环境下的事件循环的区别
Node.js event loop 和 JS 浏览器环境下的事件循环的区别: 1.线程与进程: JS 是单线程执行的,指的是一个进程里只有一个主线程,那到底什么是线程?什么是进程? 进程是 CPU ...
- 关于js内部运行机制的一本好书
读<单页Web应用一书>,第二章讲了js内部运行机制,感觉棒极了.之前读<你不知道的js>,看的云里雾里,似懂非懂.没想到单页Web一书将此内容讲的如此通俗易懂,好多困惑已久的 ...
- JS的运行机制
代码块: JS中的代码块是指由<script>标签分割的代码段.JS是按照代码块来进行编译和执行的,代码块间相互独立(即就算代码块1出错,但不影响代码块2的加载和执行),但变量和方法共享. ...
- 试着讲清楚:js代码运行机制
一. js运行机制 js执行引擎 经常看文章的说到js是带线程的,其实这个说法非常的模糊,准确的是js执行引擎是单线程的,js执行引擎就是js代码的执行器,有了这个概念就可以下来说说js是如何运行的了 ...
- 《JavaScript总结》js的运行机制
首先大家都知道javascript是单线程语言. 什么是单线程呢?比如我们去车站买票,只有一个售票窗口,大家排队买票,需要前面的人买完票,后面的人才能买票. 那为什么javascript不能是多线程呢 ...
- 详解JavaScript中的Event Loop(事件循环)机制
前言 我们都知道,javascript从诞生之日起就是一门单线程的非阻塞的脚本语言.这是由其最初的用途来决定的:与浏览器交互. 单线程意味着,javascript代码在执行的任何时候,都只有一个主线程 ...
- 浅谈javascript的运行机制
积累一下这几天学的,记录一下: 一.为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程 ...
- js setTimeout运行机制
在开始之前先看个面试例子 为什么会是0 1 2 2,而不是 0 0 1 1 再来看个例子 输出结果是4个undefined,为何不是1,2,3,4? 这是为什么呢,这是因为setTimeout是异步的 ...
- 前端读者 | 由setTimeout引发的JS引擎运行机制的研究
本文来自 @xiaoyuze88 链接:http://xiaoyuze88.github.io/ 太久没碰代码了,那天想到关于循环调用setTimeout实现每隔一秒输出递增的数的那个问题,搞了搞,发 ...
随机推荐
- Python学习--两种方法爬取网页图片(requests/urllib)
实际上,简单的图片爬虫就三个步骤: 获取网页代码 使用正则表达式,寻找图片链接 下载图片链接资源到电脑 下面以博客园为例子,不同的网站可能需要更改正则表达式形式. requests版本: import ...
- HttpSessionListener
1 知识点
- 读写锁--ReentrantReadWriteLock
读写锁,对于读操作来说是共享锁,对于写操作来说是排他锁,两种操作都可重入的一种锁.底层也是用AQS来实现的,我们来看一下它的结构跟代码: ------------------------------- ...
- 权重平等分布局And TableRow布局误区
开头语: 本人最近在自学Android,虽然本人有2年Java Web的开发经验.但是发现Android的自学之路并不是那么平坦,我没有Android真机.但是有一个window phone的手机.开 ...
- [Visual studio code 常见问题解决] ——中文乱码、
中文乱码问题解决 描述:刚开始安装VScode要打开含中文的文件,都会出现乱码,这时只要点击右下方的“UTF-8”改成“GB2312”即可.但每次都改是很麻烦的,所以要使得VScode默认支持GB23 ...
- jquery.form.js ie 下下载文件已经ie8失效问题解决方案
https://github.com/malsup/form/blob/master/jquery.form.js在使用这个插件时遇到的问题1.ie下会变成下载文件,解决方案是在后端返回时设置'Con ...
- Java中final修饰参数的作用
在方法参数前面加final关键字就是为了防止数据在方法体中被修改. 主要分两种情况:第一,用final修饰基本数据类型:第二,用final修饰引用类型. 第一种情况,修饰基本类型(非引用类型).这时参 ...
- jsp继承rapid库
如果jsp不使用继承方式开发,而是用标准的指令或动作元素去include,实在是太多重复代码. rapid-framework是谷歌的一个项目,可以实现jsp网页的继承,也就是书写模板页. 但是在ma ...
- 对象和类型(数组、ref、out)
class Program { //数组是引用类型 //如果把数组或类等其他引用类型传递给方法,对应的方法就会使用该引用类型改编数组中值, //而新值会反射到原始数组上 static void Som ...
- 二:SpringMVC知识整理
springmvc复习: 1.SpringMVC介绍 2.SpringMVC入门程序 1)创建web工程 2)导入jar包 3)在web.xml中配置前端控制器(指定上下文件的路径 classpath ...