js.jpg
如果我的文章对你有用，请给我一个赞，让我有继续坚持的动力/微笑。
原创文章，此文章仅供学习参考使用，欢迎访问我的个人网站zhengyepan
一、理解作用域
js越是基础的知识，越是会被人以为没有什么大不了的，其实，js的基础是很有“内涵”的，就作用域来讲。首先需要了解几个概念
1、引擎：从头到尾负责JavaScript的编译和执行过程.
2、编译器：负责语法分析与代码生成。
3、作用域：负责声明并维护由所有声明的标识符（变量）组成一系列查询，并实施一套非常严格的规则，确定当前执行的代码对这些标识符的访问权限。
变量的赋值操作会执行两个阶段，首先编译器会在当前作用域下声明一个变量（如果之前没有声明过），然后在运行时引擎会在作用域中查找该变量，如果能够找到就会对它赋值。
编译器在编译过程中的第二步生成代码，引擎执行到它时，会通过查找变量a来判断是是否被声明过。查找的过程有作用域进行协助，但是引擎执行怎么样的查找会影响最终的查找结果。
引擎查找的方式有LHS和RHS。“L”和“R”分别代表着左侧和右侧，具体是一个赋值操作的左侧和右侧。
那么引擎什么时候进行LHS或者RHS查找方式呢？答案就是当变量出现在赋值操作左侧的时候进行LHS,当变量出现在赋值操作右侧的时候进行RHS。更加准确的来讲，RHS的真正意思是“取到它的源值”，这意味着得到某某的值，其中对a 的引用是一个RHS 引用，因为这里a 并没有赋予任何值。相应地，需要查找并取得a 的值，这样才能将值传递给console.log(..)。相比之下，例如：a = 2;这里对a 的引用则是LHS 引用，因为实际上我们并不关心当前的值是什么，只是想要为=2 这个赋值操作找到一个目标。
重要结论：LHS 和RHS 的含义是“赋值操作的左侧或右侧”并不一定意味着就是“=赋值操作符的左侧或右侧”。赋值操作还有其他几种形式，因此在概念上最好将其理解为“赋值操作的目标是谁（LHS）”以及“谁是赋值操作的源头RHS）”。
下面的程序，其中既有LHS 也有RHS 引用：
function foo(a) {
console.log( a ); // 2
}
foo( 2 );
最后一行foo(..) 函数的调用需要对foo 进行RHS 引用，意味着“去找到foo 的值，并把它给我”。并且(..) 意味着foo 的值需要被执行，因此它最好真的是一个函数类型的值！这里还有一个容易被忽略却非常重要的细节。代码中隐式的a＝2 操作可能很容易被你忽略掉。这个操作发生在2 被当作参数传递给foo(..) 函数时，2 会被分配给参数a。为了给参数a（隐式地）分配值，需要进行一次LHS 查询。
这里还有对a 进行的RHS 引用， 并且将得到的值传给了console.log(..)。console.log(..) 本身也需要一个引用才能执行，因此会对console 对象进行RHS 查询，并且检查得到的值中是否有一个叫作log 的方法。最后，在概念上可以理解为在LHS 和RHS 之间通过对值2 进行交互来将其传递进log(..)（通过变量a 的RHS 查询）。假设在log(..) 函数的原生实现中它可以接受参数，在将2 赋值给其中第一个（也许叫作arg1）参数之前，这个参数需要进行LHS 引用查询。
有可能你可能会倾向于将函数声明function foo(a) {... 概念化为普通的变量声明和赋值，比如var foo、foo ＝ function(a) {...。如果这样理解的话，这个函数声明将需要进行LHS 查询。然而还有一个重要的细微差别，编译器可以在代码生成的同时处理声明和值的定义，比如在引擎执行代码时，并不会有线程专门用来将一个函数值“分配给”foo。因此，将函数声明理解成前面讨论的LHS 查询和赋值的形式并不合适。
function foo(a) {
console.log( a ); // 2
}
foo( 2 );
让我们来模拟上面过程中引擎和作用域之前的操作：
引擎需要为foo 进行RHS 引用。于是向作用域请求foo的声明
作用域响应：编译器刚刚声明了它。它是一个函数，给你。
引擎：执行foo。
引擎：需要为a 进行LHS 引用，向作用域请求
作用域：编译器最近把它声名为foo 的一个形式参数了，给你。
引擎：收到a ,现在要把2 赋值给a。
引擎：要为console 进行RHS 引用，问作用域见过它吗？
作用域：console 是个内置对象。给引擎。
引擎：这里面是不是有log(..)。太好了，找到了，是一个函数。
引擎：请问a 的RHS 引用吗？虽然我记得它，但想再确认一次。
作用域：这个变量没有变动过，拿走，不谢。
引擎：真棒。我来把a 的值，也就是2，传递进log(..)。
……
为什么区分LHS 和RHS 是一件重要的事情？因为在变量还没有声明（在任何作用域中都无法找到该变量）的情况下，这两种查询的行为是不一样的。
举个例子：
function foo(a) {
console.log( a + b );
b = a;
}
foo( 2 );
第一次对b 进行RHS 查询时是无法找到该变量的。也就是说，这是一个“未声明”的变量，因为在任何相关的作用域中都无法找到它。如果RHS 查询在所有嵌套的作用域中遍寻不到所需的变量，引擎就会抛出ReferenceError异常。
值得注意的是，ReferenceError 是非常重要的异常类型。相较之下，当引擎执行LHS 查询时，如果在顶层（全局作用域）中也无法找到目标变量，全局作用域中就会创建一个具有该名称的变量，并将其返还给引擎，前提是程序运行在非“严格模式”下。“不，这个变量之前并不存在，但是我很热心地帮你创建了一个。
”ES5 中引入了“严格模式”。同正常模式，或者说宽松/ 懒惰模式相比，严格模式在行为上有很多不同。其中一个不同的行为是严格模式禁止自动或隐式地创建全局变量。
因此，在严格模式中LHS 查询失败时，并不会创建并返回一个全局变量，引擎会抛出同RHS 查询失败时类似的ReferenceError 异常。接下来，如果RHS 查询找到了一个变量，但是你尝试对这个变量的值进行不合理的操作，比如试图对一个非函数类型的值进行函数调用，或着引用null 或undefined 类型的值中的属性，那么引擎会抛出另外一种类型的异常，叫作TypeError。
ReferenceError 同作用域判别失败相关，而TypeError 则代表作用域判别成功了，但是对结果的操作是非法或不合理的。
二、作用域的嵌套
作用域是根据名称查找变量的一套规则。实际情况中，通常需要同时顾及几个作用域。当一个块或函数嵌套在另一个块或函数中时，就发生了作用域的嵌套。因此，在当前作用域中无法找到某个变量时，引擎就会在外层嵌套的作用域中继续查找，直到找到该变量，或抵达最外层的作用域（也就是全局作用域）为止。
例如以下代码：
function foo(a) {
console.log( a + b );
}
var b = 2;
foo( 2 ); // 4
对b 进行的RHS 引用无法在函数foo 内部完成，但可以在上一级作用域（在这个例子中就是全局作用域）中完成。
遍历嵌套作用域链的规则很简单：引擎从当前的执行作用域开始查找变量，如果找不到，就向上一级继续查找。当抵达最外层的全局作用域时，无论找到还是没找到，查找过程都会停止。
总结：
作用域是一套规则，用于确定在何处以及如何查找变量（标识符）。如果查找的目的是对变量进行赋值，那么就会使用LHS 查询；如果目的是获取变量的值，就会使用RHS 查询。
作用域是什么 赋值操作符会导致LHS 查询。＝操作符或调用函数时传入参数的操作都会导致关联作用域 的赋值操作。JavaScript 引擎首先会在代码执行前对其进行编译，在这个过程中，像var a = 2 这样的声 明会被分解成两个独立的步骤：
-
首先，var a 在其作用域中声明新变量。这会在最开始的阶段，也就是代码执行前进行。
-
接下来，a = 2 会查询（LHS 查询）变量a 并对其进行赋值。 LHS 和RHS 查询都会在当前执行作用域中开始，如果有需要（也就是说它们没有找到所 需的标识符），就会向上级作用域继续查找目标标识符，这样每次上升一级作用域（一层 楼），最后抵达全局作用域（顶层），无论找到或没找到都将停止。 不成功的RHS 引用会导致抛出ReferenceError 异常。不成功的LHS 引用会导致自动隐式 地创建一个全局变量（非严格模式下），该变量使用LHS 引用的目标作为标识符，或者抛 出ReferenceError 异常（严格模式下）。
学习笔记，互励共勉，欢迎交流讨论~
推荐书籍《javaScript高级程序设计》
欢迎访问我的个人网站zhengyepan
网友评论