JavaScript运行原理解析

goji 发布于2019-08-23 14:42 / 1882人阅读

摘要：执行过程引擎会加载源代码，把它分解成字符串又叫做分词，再把这些字符串转换成编译器可以理解的字节码，然后执行这些字节码。接着四个进程开始参与进来，分析和执行解析器所生成的字节码。

JavaScript运行原理

知其然，也要知其所以然，这里主要谈一谈对JavaScript运行原理的理解。

JAVA虚拟机

首先我们从JAVA虚拟机说起。

首先说一下为什么要做成虚拟机，因为机器不同，如果没有虚拟机我们就相当于需要针对每一种机器都要进行代码编译，这样肯定是不合理的。所以为了解决这样的问题，Java引入虚拟机（VM）的概念，让编译后的代码直接跑在一台虚拟的机器上，无论最终的目标平台是什么，都在上面构建出一个虚拟的一致的虚拟机出来，就可以达到一次编译到处执行的效果了。

而从根本上来说Java和C#不是Native语言，编译的结果不是机器指令，而是某种自有的指令格式，自己运行不了，需要专门的程序去解释执行，这个程序就是我们所说的“虚拟机”。

反之，C、C++、Go、Rust这种语言是Native语言，编译出来的结果是机器指令，可以自己直接运行，不存在“虚拟机”的概念。

JavaScript引擎

而JavaScript引擎所做的工作和JAVA虚拟机很相似

做了什么

JS引擎主要是对JS代码进行词法、语法等分析，通过编译器将代码编译成可执行的机器码让计算机去执行。

简单来说它的唯一的目的就是读取和编译JavaScript代码，也就是说可以分析、解释、优化、垃圾回收javascript代码。

执行过程

JavaScript引擎会加载源代码，把它分解成字符串（又叫做分词），再把这些字符串转换成编译器可以理解的字节码，然后执行这些字节码。

Google的V8引擎是用C++ 编写的，它也能够编译并执行JavaScript源代码、处理内存分配和垃圾回收。它被设计成由两个编译器组成，可以把源码直接编译成机器码，具体的执行过程可以看成以下几步：

它进行词法分析，就是将源代码分解成一系列具有明确含义的符号或字符串。

然后用语法分析器分析这些符号，将其构建成语法树。

接着四个 JIT（Just-In-Time）进程开始参与进来，分析和执行解析器所生成的字节码。

与ECMAScript的关系

准确地讲，每个JavaScript引擎都实现了一个版本的ECMAScript，JavaScript是它的一个分支。随着ECMAScript的不断发展，JavaScript引擎也不断改进。之所以有这么多不同的引擎，是因为它们每个都被设计运行在不同的web浏览器、headless浏览器、或者像Node.js那样的运行时环境中。

JavaScript引擎是一段程序，我们写的JavaScript代码也是程序，如何让程序去读懂程序呢？这就需要定义规则。比如:

var a = 1 + 1

左边var代表了这是申明（declaration），它申明了a这个变量
右边的+表示要将1和1做加法
中间的等号表示了这是个赋值语句
最后的分号表示这句语句结束了
上述这些就是规则，有了它就等于有了衡量的标准，JavaScript引擎就可以根据这个标准去解析JavaScript代码了。那么这里的ECMAScript就是定义了这些规则。其中ECMAScript 62这份文档，就是对JavaScript这门语言定义了一整套完整的标准。其中包括：

var，if，else，break，continue等是JavaScript的关键词
abstract，int，long等是JavaScript保留词
怎么样算是数字、怎么样算是字符串等等
定义了操作符（+，-，>，<等）
定义了JavaScript的语法
定义了对表达式，语句等标准的处理算法，比如遇到==该如何处理
标准的JavaScript引擎就会根据这套文档去实现，注意这里强调了标准，因为也有不按照标准来实现的，比如IE的JS引擎。这也是为什么JavaScript会有兼容性的问题。至于为什么IE的JS引擎不按照标准来实现，就要说到浏览器大战了，这里就不赘述了，自行Google之。

所以，简单的说，ECMAScript定义了语言的标准，JavaScript引擎根据它来实现，这就是两者的关系。

RunTime

运行时可以简单理解为当前的运行环境，不同的环境提供了不同的api调用，如web浏览器中的window对象，DOM相关API等，这些接口可以提供相关的JS调用，

服务器托管混合云运行原理解析 JSP运行原理 hadoop运行原理 php 运行原理

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/101013.html

JavaScript 工作原理之十四－解析，语法抽象树及最小化解析时间的 5 条小技巧

摘要：事实是只是部分语言的不同表示法。基于这些，解析器会进行立即或者懒解析。然而，解析器做了完全不相关的额外无用功即解析函数。这里不解析函数，该函数声明了却没有指出其用途。所以之前的例子，解析器实际上原文请查阅这里，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland。本系列持续更新中，Github 地址请查阅这里。这是 JavaScript 工作原理的第十四章。概...

luqiuwen 2019-08-05 14:23 评论0 收藏0
JavaScript 工作原理之十四－解析，语法抽象树及最小化解析时间的 5 条小技巧

摘要：事实是只是部分语言的不同表示法。基于这些，解析器会进行立即或者懒解析。然而，解析器做了完全不相关的额外无用功即解析函数。这里不解析函数，该函数声明了却没有指出其用途。所以之前的例子，解析器实际上原文请查阅这里，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland。本系列持续更新中，Github 地址请查阅这里。这是 JavaScript 工作原理的第十四章。概...

ZweiZhao 2019-08-22 18:43 评论0 收藏0
JavaScript 工作原理之十四－解析，语法抽象树及最小化解析时间的 5 条小技巧

摘要：事实是只是部分语言的不同表示法。基于这些，解析器会进行立即或者懒解析。然而，解析器做了完全不相关的额外无用功即解析函数。这里不解析函数，该函数声明了却没有指出其用途。所以之前的例子，解析器实际上原文请查阅这里，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland。本系列持续更新中，Github 地址请查阅这里。这是 JavaScript 工作原理的第十四章。概...

xuxueli 2019-08-02 10:54 评论0 收藏0
JavaScript 工作原理之十四－解析，语法抽象树及最小化解析时间的 5 条小技巧

摘要：事实是只是部分语言的不同表示法。基于这些，解析器会进行立即或者懒解析。然而，解析器做了完全不相关的额外无用功即解析函数。这里不解析函数，该函数声明了却没有指出其用途。所以之前的例子，解析器实际上原文请查阅这里，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland。本系列持续更新中，Github 地址请查阅这里。这是 JavaScript 工作原理的第十四章。概...

jsliang 2019-08-30 15:54 评论0 收藏0
JavaScript 工作原理之十一－渲染引擎及性能优化小技巧

摘要：在中渲染树中的每个节点即是一个渲染器或者渲染器对象。计算的样式每个渲染器对象代表一个矩形区域通常是和一个节点的盒模型相对应。坐标系统是相对于根渲染器的。根渲染器的定位为和大小即为浏览器窗口的可视化部分比如。渲染器作废其在屏幕上的矩形区域。原文请查阅这里，略有删减，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland。本系列持续更新中，Github 地址请查阅这里。 ...

GraphQuery 2019-08-02 16:03 评论0 收藏0