【前端进阶】04 JavaScript引擎是如何执行JavaScript代码的

思考：
什么是执行环境、词法环境、作用域、执行上下文、闭包？

JavaScript代码运行的各个阶段

JavaScript语言是一种弱类型语言，在运行时才能确定变量类型，现在流行的typescript也是只在编译时进行了类型检测。

语法分析阶段
JavaScript引擎在执行JavaScript代码时，也会从上到下进行词法分析、语法语义分析等处理，并在代码解析完成后生成AST（抽象语法树），最终根据AST形成CPU可以执行的机器码并执行。

编译阶段
执行上下文的创建离不开JavaScript的运行环境，包括全局环境、函数环境和eval。

• 第一次载入JavaScript代码时，首先会创建一个全局环境，全局环境位于最外层，直到应用程序退出时才会被销毁
• 每个函数都有自己的运行环境，当函数被调用是，则会进入该函数的运行环境，当该环境中的代码被全部执行完毕后，该环境会被销毁。

不同的函数运行环境不一样，及时是同一个函数被多次调用时也会创建不同的函数环境

在不同的运行环境中，变量和函数可访问的其他数据范围不同，环境的行为（比如创建和销毁）也有所区别。每进入一个不同的运行环境时，JavaScript都会创建一个新的执行上下文，该过程包括

变量对象

什么是变量对象？

每一个执行上下文都会有一个关联的变量对象。该对象会保存这个上下文中定义的所有变量和函数

• 在浏览器中，全局环境的变量对象是window对象，所有的全局变量和函数都是作为window对象的属性和方法创建的
• 在NodeJs中，全局环境烦人变量对象是 global对象

创建变量对象的过程：

创建变量对象会创建arguments对象（仅函数环境下），同时会检查当前上下文的函数声明和变量声明

• 对于变量声明，此时会给变量分配内存，并将其初始化为undefined（该过程只进行定义声明，执行阶段在执行赋值语句）
• 对于函数声明，此时在内存里创建函数对象，并直接初始化为该函数对象

上述声明处理过程就是常说的变量提升和函数提升，其中，函数提升会优先变量提升，因为变量提升会带来变量在预期外被覆盖的问题，同时也可能导致本该被销毁的变量没有被销毁的情况，因此，ES6中引入了let和const关键字，从而使JavaScript也拥有的块级作用域

作用域

JavaScript是怎么支持块级作用域的呢？
在各类编程语言中，作用域分为静态作用域和动态作用域，JavaScript采用的是词法作用域，也就是静态作用域
词法作用域中的变量在编译过程中会产生确定的作用域，这个作用域即当前的执行上下文，在ES5后我们使用词法环境代替作用域来描述该执行上下文

在JavaScript中，词法环境又被分为词法环境和变量环境两种

作用域链
建立作用域链，就是将各个作用域通过某种方式链接在一起

作用域由两个成员组成，环境记录和外部词法环境，通过外部词法环境的引用，作用域可以层层拓展，建立起从里到外的一条作用域链，当某个变量无法从自身环境中找到时，可以根据外部词法环境向外找，直到最外层的词法环境中外部词法环境引用为null

JavaScript会通过外部词法环境引用来创建变量对象的一个作用域链，从而保证对执行环境有权访问的变量和函数有序访问

活动对象
在代码进入执行阶段之后，JavaScript会对变量进行赋值，此时变量对象会转为活动对象（简称AO），转换后的活动才可被访问，这就是AO->VO的过程

闭包
当函数执行结束后，执行上下文会被销毁（作用域链和活动对象均被销毁），但有时候我们要保留其中的一些变量对象，不想被销毁，此时就会使用到闭包。
通过作用域链，可以在函数内部直接读取外部以及全局全局变量，但在外部无法访问内部函数里的变量


闭包使得我们可以从外部读取局部变量，常见的用途：

• 用于从外部读取其他函数内部的变量
• 可以使用闭包来模拟私有方法
• 让这些变量的值始终保存在内存中

注意：我们在使用闭包的时候，需要及时清理不在使用到的变量，否则可能会导致内存泄漏问题

this指向

在JavaScript中，this指向执行当前代码对象的所有者，最后调用当前代码的那个对象

参考教程：前端进阶教程