js作用域与执行上下文

1. 作用域

作用域可以分为全局作用域（整个script标签包围的范围），函数作用域以及es6提出的块级作用域（{}包围的范围，例如if语句、for语句里面的{}）

函数作用域：

• 函数作用域在函数声明的时候就已经确定了，也就是说函数作用于不会随着函数的调用而改变，即函数作用域是静态的
• 作用域代表的是一块范围，则函数作用域也代表的是一块范围即函数的{}包围的区域，它的作用仅仅只是让变量在此范围内起作用，不会去管理作用域里面的变量，既然作用域不会管理作用域内部的变量，那么谁去管理呢？这就要提到一个概念：执行上下文

2. 执行上下文

执行上下文就是代码执行时的一个步骤或者说是一个环境，它规定了在代码执行前做哪些准备工作（比如this，函数的arguments），代码执行顺序，如何管理作用域内部的变量。

执行上下文可以分为全局执行上下文和函数执行上下文

全局执行上下文：

• 在全局代码执行前，先将window对象确定为全局执行上下文对象
• 对全局作用域的变量进行预解析处理（var 声明和 function声明），并添加为window的属性或方法；将 this 指向为window对象
• 开始执行全局代码，执行完毕后这个全局执行上下文是一直存在的

函数执行上下文：

• 在函数调用时，函数体代码执行以前，创建一个虚拟的函数执行上下文对象（为了方便把它叫做obj，是用来管理内部的数据的）（从这里可以看出一个函数作用域可以有多个函数执行上下文）
• 对函数作用域的变量进行预解析处理：（1）var声明和形参提升（2）形参赋值（3）arguments赋值（4）function 声明提升；并添加为obj的属性或方法
• this赋值，this添加为obj的属性
• 执行函数体代码，执行完毕后这个函数执行上下文会被消除，内部的数据也会被销毁

3. 执行上下文栈

既然上面讲到了执行上下文，那么js如何来管理全局执行上下文和函数执行上下文，更直接的来说是如何管理全局执行上下文的window对象和函数执行上下文创建的函数执行上下文对象

这个时候就有了执行上下文栈，它指的是在js执行代码前，js引擎会创建一个栈来管理所有的执行上下文对象

它的工作原理是这样的：在全局执行上下文对象（window）确定后，将其添加到栈中；在函数执行上下文对象确定后，将其添加到栈中；函数执行完毕将其移出栈；带所有代码执行完毕后，栈中只剩下window对象

看如下代码

 function fun2(params) {}
 function fun1(params) {
        fun2()
 }
 fun1()

执行上下文栈的工作原理如下图

本文参考了这篇文章 执行上下文和作用域的理解