JavaScript引擎属于单线程作业,意味着:在同一时间只能执行一个代码块,这些代码块的执行就阻塞了异步事件的处理。

因此,出现了"任务队列"(task queue),我们可以将任务分为两种:一种是同步任务(synchronous),另一种是异步任务(asynchronous)。
     同步任务:
在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务;
    异步任务:
不进入主线程、而进入"任务队列"(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行。如回调函数就是异步任务
    
具体来说,异步执行的运行机制如下。
     
 (1)所有同步任务都在主线程上执行,形成一个执行栈(execution context stack)。
      (2)主线程之外,还存在一个"任务队列"(task queue)。只要异步任务有了运行结果,就在"任务队列"之中放置一个事件。
      (3)一旦"执行栈"中的所有同步任务执行完毕,系统就会读取"任务队列",看看里面有哪些事件。那些对应的异步任务,于是结束等待状态,进入执行栈,开始执行。
      (4)主线程不断重复上面的第三步。
     只要主线程空了,就会去读取"任务队列",这就是JavaScript的运行机制。这个过程会不断重复。

简单来说,事件队列中的任务执行的条件为:

                   1.主线程已经空闲 (同步任务已经执行完毕)
                   2.任务满足触发条件,如:
                       (1) 定是函数(延时时间已经达到)
                      (2)事件函数 (特定事件被触发)
                       (3)ajax的回调函数(服务器端有数据响应)
            

下面用一个简单的例子来解释一下JavaScript处理任务处理的机制:

执行结果:

可见,定时器的回调函数是在js代码执行完成后,并满足了设置的时间条件,再执行的。

JavaScript异步的底层原理的更多相关文章

  1. JavaScript是如何工作的: CSS 和 JS 动画底层原理及如何优化它们的性能

    摘要: 理解浏览器渲染. 原文:JavaScript是如何工作的: CSS 和 JS 动画底层原理及如何优化它们的性能 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 这是专门探索 J ...

  2. JavaScript异步编程原理

    众所周知,JavaScript 的执行环境是单线程的,所谓的单线程就是一次只能完成一个任务,其任务的调度方式就是排队,这就和火车站洗手间门口的等待一样,前面的那个人没有搞定,你就只能站在后面排队等着. ...

  3. javascript引擎工作原理

    1. 什么是JavaScript解析引擎? 简单地说,JavaScript解析引擎就是能够“读懂”JavaScript代码,并准确地给出代码运行结果的一段程序.比方说,当你写了 var a = 1 + ...

  4. JavaScript的工作原理:解析、抽象语法树(AST)+ 提升编译速度5个技巧

    这是专门探索 JavaScript 及其所构建的组件的系列文章的第 14 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...

  5. 《React Native 精解与实战》书籍连载「React Native 底层原理」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  6. JavaScript的闭包原理

    什么是js(JavaScript)的闭包原理,有什么作用? 一.定义 官方解释:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 个人的理解是 ...

  7. Js(javaScript)的闭包原理

    问题?什么是js(javaScript)的闭包原理,有什么作用? 一.定义 官方解释:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分.  小编 ...

  8. Neo4j图数据库简介和底层原理

    现实中很多数据都是用图来表达的,比如社交网络中人与人的关系.地图数据.或是基因信息等等.RDBMS并不适合表达这类数据,而且由于海量数据的存在,让其显得捉襟见肘.NoSQL数据库的兴起,很好地解决了海 ...

  9. JavaScript模板引擎原理

    JavaScript模板引擎原理,几行代码的事儿 2013-12-03 16:35 by BarretLee, 650 阅读, 6 评论, 收藏, 编辑 一.前言 什么是模板引擎,说的简单点,就是一个 ...

随机推荐

  1. HTML5的新特性:范围样式,又叫做<style scoped>

    Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做<style scoped> .开发者可以通过为根元素设定一个添加了scoped属性的style标签,来限制样式只作用于 ...

  2. Spring配置:用context:property-placeholder替换PropertyPlaceholderConfigurer

    1.有时候需要从properties文件中加载配置,以前的方式是这样的: <bean id="jdbcProperties" class="org.springfr ...

  3. 跳转控制语句return

    return语句的作用不是为了跳出循环,更常用的功能是结束一个方法,也就是退出一个方法,跳转到上层调用的方法处. 演示案例: 结束循环其实是结束了main方法 public static void m ...

  4. IOC和AOP使用扩展之AOP详解实现类

    摘要:   “Depend on yourself” is what nature says to every man.  Parents can help you. Teachers can hel ...

  5. VXcode学习

    1.安装中文包(chinese) 2.打开控制面板ctrl+shift+p

  6. SQL报错:ORA-00911:无效的字符错误

    转载自:https://blog.csdn.net/huangyanlong/article/details/38096469 *)ORA-00911:无效的字符错误——由编译环境下一个小错误引起.S ...

  7. chrome flash 自动暂停问题

    chrome flash 尺寸小于398*298时,只要宽和高某一个值小于对应值就会自动暂停,出现这个圆形的播放按钮.(估计是当广告处理了...) 将尺寸调大即可.

  8. 高通平台msm8916修改开机logo【原创】

    经过两天的奋战终于把开机logo给搞定了啊. 首先修改开机logo要从哪里入手呢?先分析一下源码看看. ---> void display_image_on_screen() { struct ...

  9. qbzt day7上午

    由于优盘咕咕咕了,所以这篇就咕咕咕了 以后还会补上的 qwq

  10. (转)oracle触发器使用:after insert 与before insert的简单使用注意

    本文转载自:http://blog.csdn.net/kuangfengbuyi/article/details/41446125 创建触发器时,触发器类型为after insert , 在begin ...