js预编译阶段
js代码在经过语法分析的阶段后会进入预编译阶段.
预编译发生在函数执行的前一刻,过程如下:
- 创建AO对象,执行期上下文,执行上下文是js代码在被解析执行时所在环境的抽象概念。
- 寻找函数的形参和变量声明,将变量和形参名作为AO对象的属性名,值设定为undefined.
- 将形参和实参相统一,即更改形参后的undefined为具体的形参值。
- 寻找函数中的函数声明,将函数名作为AO属性名,值为函数体。
至此,预编译环节结束,函数中变量按照最终AO对象中的值开始执行。
执行上下文
由于js运行环境主要有三种:
- 全局环境
- 函数环境
- eval(不建议使用,会有安全、性能问题)
每次进入一个运行环境是都会创建一个相应的执行上下文,所以执行上下文分三种:
1.全局执行上下文
2.函数执行上下文
3.eval函数执行上下文
执行上下文分为两个阶段:执行上下文的创建与执行
创建执行期上下文时,主要做了下面的这些事情:
1.确定this指向
2.词法环境创建
3.变量环境的创建
执行栈
具有栈的后进先出(LIFO)的特性 用于存储代码执行时产生的执行上下文
首次运行JS代码时,会创建一个全局执行上下文并Push到当前的执行栈中。每当发生函数调用,引擎都会为该函数创建一个新的函数执行上下文并Push到当前执行栈的栈顶。
根据执行栈LIFO规则,当栈顶函数运行完成后,其对应的函数执行上下文将会从执行栈中pop出,上下文控制权将移到当前执行栈的下一个执行上下文。而全局执行上下文则在浏览器或者该标签页关闭时出栈
栈底始终为全局执行上下文(Global Execution Context)
词法环境
两个组成部分:
1.环境记录:存储变量和函数声明的实际位置
2.对外部环境的引用:访问的外部词法环境
变量提升的原因:在创建阶段,函数声明存储在环境中,而变量会被设置为 undefined
,简单来说,在js的预编译阶段时变量声明就存储在了环境中了,而执行函数体的过程还在预编译之后
变量环境
变量环境也是一个词法环境,因此它具有上面定义的词法环境的所有属性。
在 ES6 中,词法环境和变量环境的区别在于前者用于存储函数声明和变量( let
和 const
)绑定,而后者仅用于存储变量( var
)绑定。
执行阶段
此阶段,完成对所有变量的分配,最后执行代码。
如果 Javascript 引擎在源代码中声明的实际位置找不到 let
变量的值,那么将为其分配 undefined
值。