深入理解JavaScript——作用域 VS 执行上下文

笔者在前文作用域、执行上下文中介绍过作用域和执行上下文，它们是 JavaScript 中很重要的知识点，是基础中的重点，是重点中的基础。

我们讲过 JavaScript 中的作用域是词法作用域，与在哪里定义有关；而执行上下文则和调用有关，两者有关联但却是不同概念

作用域

而执行上下文与调用有关
它表示一段代码执行时所带的所有信息
- 包括 this、词法环境、变量环境（ES5标准）
- 结合之前 this 所给的定义：谁调用它，this 就指向谁 就是和执行上下文相关。执行上下文也是如此，与调用者息息相关
生命周期为两个阶段
- 创建阶段
  - 确定 this 指，即我们熟知的 this 绑定
  - 创建变量环境
    - 环境记录器
      - 登记 var、function 等声明的变量
      - 此时会发生变量提升和函数提升
    - 对外部环境的引用（outer）
      - 指向父作用域（作用域在代码执行前就确定了）
  - 创建词法环境
    - 环境记录器
      - 登记 let、const 等声明的变量
      - 会发生变量提升（hoist），但是不会被初始化，所以提前使用会报 ReferenceError，如例1所示
    - 对外部环境的引用（outer）
      - 同样指向父作用域
- 执行阶段
  - 指向代码
  - 确定作用域链
它则是“动态”的（与调用方相关）
共全局执行上下文、函数执行上下文、模块执行上下文、eval 执行上下文

例子1：

a // undefined
b // ReferenceError
c // ReferenceError
d // function d() {}

var a = 1;
let b = 2;
const c = 3;
function d(){}

var 声明变量会被初始化为 undefined，一般函数（函数声明式写法）定义会被初始化为 function xx(){} ，let、const 则不会被初始化，所以 var 定义的变量可以提前使用但指为 undefined，一般函数定义可以正常提前使用，let、const 提前使用则会报错

PS，如果使用函数表达式写法使用函数，则跟变量，如 var e = function(){} 或者 let f = () => {}

以上就是作用域和指向上下文的各种区别