zoukankan      html  css  js  c++  java
  • JS引擎的执行机制

    JS引擎的执行机制

    1.什么是JavaScript解析引擎

    • js引擎就是能够读懂JavaScript代码,并准确地给出代码运行结果的一段程序。
    • 对于静态语言(eg:Java、C++、C),处理上述事情的叫编译器,相应地对于JavaScript这样的动态语言则叫做解释器。区别:编译器是将源代码编译为另外一种代码(比如机器码或者字节码),而解释器是直接解析并将代码运行结果输出,比如firebug的console就是一个JavaScript解释器。
    • V8引擎,为了提高JS的运行性能,在运行之前会将JS编译为本地的机器码,然后再去执行机器码。底层采用C/C++编写。

    2.运行机制:

    • 首先判断JS是同步还是异步,同步就进入主进程,异步就进入event table
    • 异步任务在event table中注册函数,当满足触发条件后,被推入event queue
    • 同步任务进入主线程后一直进行,直到主线程空闲时,才会去event queue中查看是否有可执行的异步任务,有就推入主进程中。

    macro-task(宏任务):包括整体代码script、setTimeout、setInterval
    micro-task(微任务):Promise、process.nextTick

    执行一个宏任务,过程中如果遇到微任务,就将其放到微任务的“事件队列”中;
    当前宏任务执行完成后,会查看微任务的“事件队列”,并将里面全部的微任务依次执行完。

    setTimeout(function(){console.log("定时器开始啦")});
    new Promise(function(resolve){
    	console.log("马上开始");
    	for(var i=0;i<1000;i++){i==99 && resolve();}
    }).then(function(){console.log("执行then函数")});
    console.log("代码执行完毕");
    

    分析:

    • 首先执行script下的宏任务,遇到setTimeout,将其放到宏任务的“异步队列"Li
    • 遇到new Promise直接执行,打印"马上执行for循环"
    • 遇到then方法,是微任务,将其放到"微任务队列"中
    • 打印"代码执行结束"
    • 本轮宏任务执行完毕,查看本轮微任务,发现有一个then方法里的函数,打印"执行then函数"
    • 待主进程中的同步任务执行完成之后,查看异步队列,执行console.log("定时器开始啦");

    3.关于setTimeout

    setTimeout(function(){console.log('执行了');});
    

    3s后,setTimeout里的函数被推入event queue,而event queue(事件队列)里的任务,只有在主线程空闲时才会执行。所以,只有同时满足(1)3s后(2)主线程空闲;才会3s后执行该函数。

    4.关于JavaScript的单线程

    为了利用多核CPU的计算能力,HTML5 提出Web Worker标准,允许JavaScript脚本创建多个线程,但是子线程完全受主线程控制,且不得操作DOM。所以,这个标准并没有改变JavaScript单线程的本质。

    5.关于任务队列

    • 由于单线程,所有任务需要排队,前一个任务耗时很长,后一个任务就不得不一直等着。
    • 如果排队是因为计算量大,CPU忙不过来,倒也算了,但是很多时候CPU是闲着的,因为IO设备很慢(比如Ajax操作从网络读取数据),不得不等这结果出来,再往下执行。
    • 此时,主线程完全可以不管IO设备,挂起处于等待中的任务,线运行排在后面的任务。等到IO设备返回了结果,再回过头,把挂起的任务继续执行下去。
    • 于是:任务分为两种,同步任务和异步任务。同步任务:在主线程上排队执行的任务,著有前一个任务执行完毕,才能执行后一个任务;异步任务:不进入主线程,而是进入“任务队列"(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行。

    6.异步执行机制

    • 所有同步任务都在主线程上执行,形成一个执行栈;
    • 主线程之外,还存在一个“任务队列"(task queue)。只要异步任务有了运行结果,就在"任务队列"之中放置一个事件;
    • 一旦“执行栈"中的所有同步任务执行完毕,系统就会读取"任务队列",看看里面有哪些事件。那些对应的异步任务,于是结束等待状态,进入执行栈,开始执行。
    • 主线程不断重复上面的第三步。
    • 只要主线程空了,就会去读取“任务队列",这就是JavaScript的运行机制。

    7.事件和回调函数

    • “任务队列”是一个事件的队列,IO设备完成一项任务,就在“任务队列”中添加一个事件,表示相关的异步任务可以进入“执行栈”了。主线程读取“任务队列”,就是读取里面有哪些事件。
    • “任务队列”中的事件,除了IO设备的事件以外,还包括一些用户产生的事件(如鼠标点击、页面滚动等)。只要指定过回调函数,这些事件发生时就会进入“任务队列”,等待主线程读取。
    • 所谓“回调函数”,就是那些会被主线程挂起来的代码。异步任务必须指定回调函数,当主线程开始执行异步任务,就是执行对应的回调函数。
    • “任务队列”是一个先进先出的数据结构,排在前面的事件,优先被主线程读取。主线程的读取过程基本上是自动的,只要执行栈一清空,“任务队列”上第一位的事件就自动进入主线程。但是,由于存在“定时器”功能,主线程首先要检查一下执行时间,某些事件只有到了规定的时间,才能返回主线程。

    8.Node.js的EventLoop

    • 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时执行。

    参考:
    《10分钟理解JS引擎的执行机制》 https://segmentfault.com/a/1190000012806637
    《JavaScript运行机制详解:再谈Event Loop》 http://www.ruanyifeng.com/blog/2014/10/event-loop.html

  • 相关阅读:
    scrapy Request方法
    from lxml import etree报错
    python文件管道 下载图集
    scrapy基本爬虫,采集多页
    python操作excel xlwt (转)
    matplotlib 设置标题 xy标题等
    matplotlib 饼状图
    acwing 600. 仰视奶牛
    LeetCode 684. 冗余连接
    LeetCode 200. 岛屿数量
  • 原文地址:https://www.cnblogs.com/nanhuaqiushui/p/8723869.html
Copyright © 2011-2022 走看看