js内部运行解析

素颜马尾好姑娘i 2023-02-23 12:24 52阅读 0赞

学习jsp的时候，想了解它的运行原理，但是呢，好多都是要么很深，要么很浅，整理了一下，适合一年内的小白理解：  
首先需要了解几个关键字的意思：  
1： interpreter:解释器。 逐行读取代码并立即执行  
2： compiler: 编译器 读取整个代码，然后做代码优化，生成优化后的代码。  
3： profiler: 分析。 查找可以被优化的代码块。  
4： parser：解析器 。 可以通过各种js关键字来识别，分析分类各种程序，也就是可以识别代码中的方法，变量等。  
5： AST：抽象语法树。 基于 Parser 的分类构造树状结构。  
6： 引擎：比如说谷歌的v8引擎，可以编译字节码。

如果你对这些词没什么概念，没关系，上图：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA_size_16_color_FFFFFF_t_70]  
这张图画了个大的范围：大概流程就是客户端到服务器端再响应到客户端，比较模糊。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA_size_16_color_FFFFFF_t_70 1]  
一：这张图介绍了，程序员写出代码然后发布，之后解析器会对代码进行分类，识别划分区域；  
二：AST进行把分类后的代码，用抽象的方法，抽象出树结构。  
三：就是通过解释器进行解释，生成字节码，由于是逐条进行并且立即执行的，所以在浏览器上会很快生成字节码，不需要等待，这时候浏览器上的引擎便会出来，处理字节码，（字节码虽然不是机器语言，但是，在浏览器引擎上是可以被直接翻译的，因为引擎内有翻译字节码的工具）。但是如果需要执行的是大量代码时，只进行解释器的话还是会很慢，这时就有了四。  
四：profiler:分析查找可以被优化的代码，这步和第三步并不冲突，第三步执行时，结果已经产生，用户也就不用等待了，但是机器内部同时也在执行第四步。  
五：compiler: 编译器 。计算把代码优化后，对优化后的代码进行编译，生成机器语言。这样也就解决了大量代码速度慢的情况。

以上便是js文件在计算机内部的运行过程。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200707172627652.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200707172554440.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NzA0NTk2MA==,size_16,color_FFFFFF,t_70