# 作用域链

# 作用域是什么

# 第 1 章 作用域是什么

# 编译原理

在传统编译语言的流程中,程序中的一段源代码在执行之前会经历三个步骤,统称为“编译”

# 理解作用域

参与者

  • 引擎 从头到尾负责整个 JavaScript 程序的编译及执行过程。
  • 编译器 引擎的好朋友之一,负责语法分析及代码生成等脏活累活(详见前一节的内容)。
  • 作用域 引擎的另一位好朋友,负责收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套非常严格的规则,确定当前执行的代码对这些标识符的访问权限。

总结:变量的赋值操作会执行两个动作,首先编译器会在当前作用域中声明一个变量(如果之前没有声明过),然后在运行时引擎会在作用域中查找该变量,如果能够找到就会对它赋值

LHS 和 RHS

function foo(a) {
  console.log(a)
}
foo(2)
// RHS 查找一个马上要用的值  查找
// LHS 需要把一个值放到一个地方 赋值

https://www.jianshu.com/p/ecb1c72fd902

# 作用域嵌套

引擎从当前的执行作用域开始查找变量,如果找不到,就向上一级继续查找。当抵达最外层的全局作用域时,无论找到还是没找到,查找过程都会停止。 LHS 和 RHS 引用都会在当前楼层进行查找

# 异常

为什么区分 LHS 和 RHS 是一件重要的事情?

因为当无法找到变量时 处理结果可能不一致

在 非严格模式/严格模式 下 如果 RHS 查询在所有嵌套的作用域中遍寻不到所需的变量,引擎就会抛出 ReferenceError 异常 在 非严格模式下 当引擎执行 LHS 查询时,如果在顶层(全局作用域)中也无法找到目标变量,全局作用域中就会创建一个具有该名称的变量,并将其返还给引擎 在 非严格模式下 LHS 查询失败时,并不会创建并返回一个全局变量,引擎会抛出同 RHS 查询失败时类似的 ReferenceError 异常

ReferenceError 同作用域判别失败相关,而 TypeError 则代表作用域判别成功了,但是对结果的操作是非法或不合理的。

# 第 2 章 词法作用域

作用域共有两种主要的工作模型

词法作用域

动态作用域

# 词法阶段

什么叫词法?

编译器的第一个工作阶段叫作词法化 词法化的过程会对源代码中的字符进行检查,如果是有状态的解析过程,还会赋予单词语义

词法作用域就是定义在词法阶段的作用域

词法作用域是由你在写代码时将变量和块作用域写在哪里来决定的,因此当词法分析器处理代码时会保持作用域不变(大部分情况下是这样的)

无论函数在哪里被调用,也无论它如何被调用,它的词法作用域都只由函数被声明时所处的位置决定。

# 欺骗词法 欺骗词法作用域会导致性能下降

  • eval JavaScript 中的 eval(..)函数可以接受一个字符串为参数,并将其中的内容视为好像在书写时就存在于程序中这个位置的代码。

setTimeout setInterval new Function() 都可以接收一个代码字符串 来运行一段代码

在程序中动态生成代码的使用场景非常罕见,因为它所带来的好处无法抵消性能上的损失

  • with

with

总结

词法作用域意味着作用域是由书写代码时函数声明的位置来决定的。编译的词法分析阶段基本能够知道全部标识符在哪里以及是如何声明的,从而能够预测在执行过程中如何对它们进行查找。

# 第 3 章 函数作用域和块作用域

# 函数中的作用域

属于这个函数的全部变量都可以在整个函数的范围内使用及复用(事实上在嵌套的作用域中也可以使用)。这种设计方案是非常有用的,能充分利用 JavaScript 变量可以根据需要改变值类型的“动态”特性

# 函数作用域

区分函数声明函数表达式最简单的方法是看 function 关键字出现在声明中的位置(不仅仅是一行代码,而是整个声明中的位置)。如果 function 是声明中的第一个词,那么就是一个函数声明,否则就是一个函数表达式。

函数声明和函数表达式之间最重要的区别是它们的名称标识符将会绑定在何处。

函数表达式可以是匿名的,而函数声明则不可以省略函数名——在 JavaScript 的语法中这是非法的

# 块作用域

表面上看 JavaScript 并没有块作用域的相关功能 var

with

同时也是块作用域的一个例子(块作用域的一种形式),用 with 从对象中创建出的作用域仅在 with 声明中而非外部作用域中有效。

try/catch

会创建一个块作用域,其中声明的变量仅在 catch 内部有效。

let

let 为其声明的变量隐式地劫持了所在的块作用域

const

用来创建块作用域变量,但其值是固定的(常量)。之后任何试图修改值的操作都会引起错误

# 第 4 章 提升

作用域同其中的变量声明出现的位置有某种微妙的联系

包括变量和函数在内的所有声明都会在任何代码被执行前首先被处理。

  • 函数声明直接提前

一个普通块内部的函数声明通常会被提升到所在作用域的顶部

函数优先 函数声明比赋值优先 函数重复声明会覆盖 函数和普通声明已函数声明为准

总结

我们习惯将 var a = 2;看作一个声明,而实际上 JavaScript 引擎并不这么认为。它将 var a 和 a = 2 当作两个单独的声明,第一个是编译阶段的任务,而第二个则是执行阶段的任务。

这意味着无论作用域中的声明出现在什么地方,都将在代码本身被执行前首先进行处理。可以将这个过程形象地想象成所有的声明(变量和函数)都会被“移动”到各自作用域的最顶端,这个过程被称为提升。

声明本身会被提升,而包括函数表达式的赋值在内的赋值操作并不会提升。

要注意避免重复声明,特别是当普通的 var 声明和函数声明混合在一起的时候,否则会引起很多危险的问题!

# 第 5 章 作用域闭包

谈闭包 先要谈作用域

当函数可以记住并访问所在的词法作用域时,就产生了闭包,即使函数是在当前词法作用域之外执行

一个函数执行完成以后 在某个时间 另外一个函数执行会用到第一个函数内部的作用域变量 这就是闭包

只要使用了回调函数,实际上就是在使用闭包! 因为回调的作用就是等待被触发 触发就会使用当时函数作用域

当查找变量的时候,会先从当前上下文的 变量对象中 查找,如果没有找到,就会从父级(词法层面上的父级)执行上下文的 变量对象 中查找,一直找到全局上下文的变量对象,也就是全局对象。这样由多个执行上下文的变量对象构成的链表就叫做作用域链。

# 函数创建

函数的作用域在函数定义的时候就决定了。

这是因为函数有一个内部属性 [[scope]],当函数创建的时候,就会保存所有父变量对象到其中,你可以理解 [[scope]] 就是所有父变量对象的层级链,但是注意:[[scope]] 并不代表完整的作用域链!

// 例子
function foo() {
    function bar() {
        ...
    }
}
//
foo.[[scope]] = [
  globalContext.VO
];

bar.[[scope]] = [
    fooContext.AO,
    globalContext.VO
];

# 函数激活

当函数激活时,进入函数上下文,创建 VO/AO 后,就会将活动对象添加到作用链的前端 这时候执行上下文的作用域链,我们命名为 Scope:

// 当前函数的作用域 = 当前函数AO 合并之前函数声明时所有父变量对象
Scope = [AO].concat([[Scope]])