参考:https://segmentfault.com/a/1190000012925872#articleHeader4

一、为什么有Event Loop

Javascript设计之初就是一门单线程语言,Event Loop就是为了解决主线程不阻塞的问题。

二、Event Loop流程

1、js中有同步任务、异步任务两种

2、同步任务在JS引擎线程执行,形成执行栈

3、异步任务在已有异步操作结果符合触发条件时,进入任务队列(由事件触发线程管理)等待执行

4、执行栈中的任务运行完成后(JS引擎空闲),从任务队列中读取任务,加入到执行栈,并执行

三、图解流程、数据结构、与浏览器各线程之间关系

四、定时器

1、定时器是独立线程控制:

定时触发是由定时器线程控制的,这是因为JavaScript引擎是单线程的, 如果处于阻塞线程状态就会影响记计时的准确,因此很有必要单独开一个线程用来计时。

2、定时器实现流程

定时器实现在预先设定的时间后,将事件推入任务队列,等待执行栈执行。由于定时事件在推入任务队列中时,JS引擎线程正在执行其他任务,这时要定时事件要等待JS引擎线程空闲才能执行,就可能出现定时事件不能准时执行

3、对于0毫秒的定时:

W3C在HTML标准中规定,规定要求setTimeout中低于4ms的时间间隔算为4ms,但不排除不同浏览器最小事件设置不同。

即便时间间隔为0也需要进入任务队列等待JS引擎线程空闲的过程,执行栈中的任务还是早于定时任务执行

浏览器工作原理(三):js运行机制及Event Loop的更多相关文章

  1. Js 运行机制和Event Loop

    一.为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. Java ...

  2. JS运行机制之 Event Loop 的思考

    先举个栗子,如下: for (var i = 0; i < 5; i++) { setTimeout(function() { console.log('i: ',i); //一秒之后输出几乎没 ...

  3. JavaScript 运行机制以及Event Loop(事件循环)

    一.JavaScript单线程 众所周知JavaScript是一门单线程语言,也就是说,在同一时间内JS只能做一件事.为什么JavaScript不能有多个线程呢?这样不是能够提高效率吗? JavaSc ...

  4. 如何通过setTimeout理解JS运行机制详解

    setTimeout()函数:用来指定某个函数或某段代码在多少毫秒之后执行.它返回一个整数,表示定时器timer的编号,可以用来取消该定时器. 例子 ? 1 2 3 4 5 console.log(1 ...

  5. js运行机制(线程)

    浏览器线程 js运作在浏览器中,是单线程的,即js代码始终在一个线程上执行,这个线程称为js引擎线程. 浏览器是多线程的,除了js引擎线程,它还有:  UI渲染线程 浏览器事件触发线程 http请求线 ...

  6. js 运行机制

    <script> console.log(1) setTimeout(function(){ console.log(3) },0) console.log(2) </script& ...

  7. Js 运行机制 (重点!!)

    一.引子 本文介绍JavaScript运行机制,这一部分比较抽象,我们先从一道面试题入手: 这一题看似很简单,但如果你不了解JavaScript运行机制,很容易就答错了.题目的答案是依次输出1 2 3 ...

  8. js 运行机制简单了解

    一.如何理解 JS 的单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. JavaScrip ...

  9. js运行机制详解:event loop

    总结 阮一峰老师的博客 一.为什么JavaScript是单线程 JavaScript语言的一大特点就是单线程 那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. JavaScript ...

随机推荐

  1. cscope使用记录

    在看c的源码过程中,仅仅使用ctags不够用,加入cscope会好一点,关于vim的配置就不多说了,在这里主要是记录常用的几个东西: 在代码的最顶层执行: cscope -Rbkq 打开vim: cs ...

  2. Shell 命令行获取本机IP,grep的练习

    Shell 命令行获取本机IP,grep的练习 在 mac 下面输入 ifconfig 或者在 linux 下面输入 ip a 就可以得到我们的网卡信息.不过通常情况下,我们需要查看的是我们的IP地址 ...

  3. 【Keras学习】常见问题与解答

    Keras FAQ:常见问题 如何引用Keras? 如果Keras对你的研究有帮助的话,请在你的文章中引用Keras.这里是一个使用BibTex的例子 @misc{chollet2015keras, ...

  4. HslCommunication库的二次协议扩展,适配第三方通讯协议开发,基础框架支持长短连接模式

    本文将使用一个gitHub开源的项目来扩展实现二次协议的开发,该项目已经搭建好了基础层架构,并实现了三菱,西门子,欧姆龙,MODBUS-TCP的通讯示例,也可以参照这些示例开发其他的通讯协议,并Pul ...

  5. 动态样式语言Sass&Less介绍与区别

    一. Sass/Scss&Less是什么? Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,语法跟css一样(但多了些功能),比css好写, ...

  6. 线性回归 Linear regression(3) 线性回归的概率解释

    这篇博客从一种方式推导了Linear regression 线性回归的概率解释,内容来自Standford公开课machine learning中Andrew老师的讲解. 线性回归的概率解释 在Lin ...

  7. log4j的使用配置

    1.与spring整合,web.xml中配置详情 <!-- 加载log4j的配置文件log4j.properties --> <context-param> <param ...

  8. Set集合学习

    Java中的Set主要有:HashSet.TreeSet.LinkedHashSet. 一:HashSet HashSet 是一个没有重复元素的无序集合. HashSet由HashMap实现的,不保证 ...

  9. BZOJ1486 HNOI2009 最小圈 【01分数规划】

    BZOJ1486 HNOI2009 最小圈 Description 应该算是01分数规划的裸板题了吧..但是第一次写还是遇到了一些困难,vis数组不清零之类的 假设一个答案成立,那么一定可以找到一个环 ...

  10. 让thinkphp 5 支持pathinfo 的 nginx ,去掉index.php

    在TP5.0中查阅tp5官方文档,注意:5.0取消了URL模式的概念,并且普通模式的URL访问不再支持.phthinfo 是什么? PHP中的全局变量$_SERVER['PATH_INFO']是一个很 ...