黑龙江专业网站建设,游戏推广员每天做什么,wordpress 使用插件,苏州h5模板建站JS运行原理
深入了解V8引擎原理
浏览器内核是由两部分组成的#xff0c;以webkit为例#xff1a;
WebCore#xff1a;负责HTML解析、布局、渲染等等相关的工作#xff1b;JavaScriptCore#xff1a;解析、执行JavaScript代码#xff1b; 官方对V8引擎的定义#xff1…JS运行原理
深入了解V8引擎原理
浏览器内核是由两部分组成的以webkit为例
WebCore负责HTML解析、布局、渲染等等相关的工作JavaScriptCore解析、执行JavaScript代码 官方对V8引擎的定义
V8是用C 编写的Google开源高性能JavaScript和WebAssembly引擎它用于Chrome和Node.js等它实现ECMAScript和WebAssembly并在Windows 7或更高版本macOS 10.12和使用x64IA-32ARM或MIPS处理 器的Linux系统上运行。V8可以独立运行也可以嵌入到任何C 应用程序中。 V8引擎的架构很复杂 我们可以先了解它庞大引擎的一些模块
Parse模块会将JavaScript代码转换成AST抽象语法树这是因为解释器并不直接认识JavaScript代码 如果函数没有被调用那么是不会被转换成ASTParse的V8官方文档https://v8.dev/blog/scanner Ignition是一个解释器会将AST转换成ByteCode字节码 同时会收集TurboFan优化所需要的信息比如函数参数的类型信息有了类型才能进行真实的运算如果函数只调用一次Ignition会解释执行ByteCodeIgnition的V8官方文档https://v8.dev/blog/ignition-interpreter TurboFan是一个编译器可以将字节码编译为CPU可以直接执行的机器码 如果一个函数被多次调用那么就会被标记为热点函数它会被TurboFan转换成优化的机器码提高代码的执行性能机器码实际上也会被还原为ByteCode这是因为如果后续执行函数的过程中类型发生了变化比如sum函数原来执 行的是number类型后来执行变成了string类型之前优化的机器码并不能正确的处理运算就会逆向的转换成字节码TurboFan的V8官方文档https://v8.dev/blog/turbofan-jit
V8架构解析图 来自官方 解析代码的步骤
获得到代码之后 V8用流输入通过词法分析分析成token解析/预解析 来生成一个一个执行节点生成 AST 树转成字节码 如果有热点方法就会走turbofan编译器优化成机械码提升性能
全局代码执行过程
js引擎会在执行代码之前会在堆内存中创建一个全局对象Global ObjectGO
该对象 所有的作用域scope都可以访问里面会包含Date、Array、String、Number、setTimeout、setInterval等等其中还有一个window属性指向自己
js引擎内部有一个执行上下文栈Execution Context Stack简称ECS它是用于执行代码的调用栈
他执行的式全局代码块它的作用就是
为了执行代码构建一个 Global Execution Context GEC 全局上下文将这个构建的上下文加入到执行栈中 也就是将 GEC 放入 ECS中 GEC被放入到ECS中里面包含两部分内容 在代码执行前在parser转成AST的过程中会将全局定义的变量、函数等加入到GlobalObject中但是并不会赋值在代码执行中对变量赋值或者执行其他的函数 每一个执行上下文会关联一个VOVariable Object变量对象变量和函数声明会被添加到这个VO对象中当全局代码被执行的时候VO就是GO对象了
全局上下文三个关键
VOgo作用域链This
执行以下代码过程 var message Global Messagefunction foo() {var message Foo Message}var num1 10var num2 20var res num1 num2console.log(res);全局代码执行前 执行代码后 函数代码执行过程
在执行的过程中执行到一个函数时就会根据函数体创建一个函数执行上下文Functional Execution Context简称FEC并且压入到EC Stack中
当进入一个函数执行上下文时会创建一个AO对象Activation Object这个AO对象会使用arguments作为初始化并且初始值是传入的参数这个AO对象会作为执行上下文的VO来存放变量的初始化 如下函数执行过程 执行前 执行后 流程为
执行前创建FEC 也就是函数执行上下文创建 AO 对象 name为函数名创建作用域链生成函数对象存放代码thisbing暂无之后从上到下执行代码执行完成后将name 变为 undefined
作用域和作用域链
当进入到一个执行上下文时执行上下文也会关联一个作用域链Scope Chain
作用域链是一个对象列表用于变量标识符的求值当进入一个执行上下文时这个作用域链被创建并且根据代码类型添加一系列的对象
PS 作用域会提升 在本身vo没有情况下 会去上层寻找我们先输出后声明会输出undefined 这里也印证了
作用域提升小练习
var n 100
function foo(){n200
}
foo()
console.log(n)N 200
顺序内存查找图如下
全局代码创建函数 找到 n放入到函数vo中 之后调用foo在函数调用后找到GO中的n复制函数结束之后输出n 作用域链也是我们JS闭包的一个重点 js中闭包就是通过作用域链的方式来完成变量可以跨作用域访问的为我们加快提升了开发的效率 也省去很多麻烦
