1. 两种作用域
“作用域”我们晓得是一套划定规矩，用来治理引擎怎样在当前作用域以及嵌套的子作用域中依据标识符称号举行变量查找。
作用域有两种重要事情模子：词法作用域和动态作用域。
大多数言语采纳的都是词法作用域，少数言语采纳动态作用域（比方 Bash 剧本），这里我们重要议论词法作用域。
2. 词法
大部份规范言语编译器的第一个事情阶段叫作词法化。
简朴地说，词法作用域是由你在写代码时将变量和函数（块）作用域写在那里来决议的。固然，也会有一些方法来动态修正作用域，后边我会引见。
举个例子：
var a = 2;
function foo1 () {
console.log(a);
}
function foo2 () {
var a = 10;
foo1();
}
foo2();这里输出效果是多少呢？
注重，这里效果打印的是 2。
可以会有一些同砚认为是 10，那就是没有搞清楚词法作用域的观点。
前边引见了，词法作用域只取决于代码誊写时的位置，那末在这个例子中，函数 foo1 定义时的位置决议了它的作用域，经由过程下图明白：
foo1 和 foo2 都是离别定义在全局作用域中的函数，它们是并列的，所以在 foo1 的作用域链中并不包括 foo2 的作用域，虽然在 foo2 中挪用了 foo1，然则 foo1 对变量 a 举行 RHS 查询时，在自身的作用域没有找到，引擎会去 foo1 的上级作用域（也就是全局作用域）中查找，而并不会去 foo2 的作用域中查找，终究在全局作用域中找到 a 的值为 2。
总结来讲，不管函数在那里被挪用，也不管它怎样被挪用，它的词法作用域都只由函数被声明时所处的位置决议。
3. 诳骗词法
JavaScript 中有 3 种体式格局可以用来“诳骗词法”，动态转变作用域。
第一种： eval
JavaScript 中 eval(…) 函数可以接收一个字符串作为参数，并将个中的内容视为好像在誊写时就存在于顺序中这个位置的代码。
在实行 eval(…) 以后的代码时，引擎并不晓得或在乎前面的代码是以动态情势插进去进来并对词法作用域环境举行修正的，引擎只会像平常一样一般举行词法作用域的查找。
举个例子：
function foo (str) {
eval(str); // "诳骗"词法
console.log(a);
}
var a = 2;
foo("var a = 10;");如人人所想，输出效果为 10。
由于 eval(“var a = 10;”) 在 foo 的作用域中新建立了一个同名变量 a，引擎在 foo 作用域中对 a 举行 RHS 查询，找到了新定义的 a，值为 10，所以不再向上查找全局作用域中的 a，所以致使输出效果为 10，这就是 eval(…) 的作用。
在严厉形式下，eval(…) 在运转时有自身的词法作用域，意味着个中的声明没法修正地点的作用域。
'use strict;'
function foo (str) {
eval(str); // eval() 有自身的作用域，所以并不会修正 foo 的词法作用域
console.log(a);
}
var a = 2;
foo("var a = 10;");这里输出效果为 2。
JavaScript 中另有一些功用和 eval(…) 相似的函数，比方 setTimeout(…) 和 setInterval(…) 的第一个参数可以是一个字符串，字符串的内容可以解释为一段动态天生的代码。这些功用已过期而且不被首倡，最好不要运用它们。new Function(…) 函数的末了一个参数也可以接收代码字符串，并将其转化为动态天生的函数，也只管防止运用。
在顺序中动态天生代码的运用场景非常稀有，由于它所带来的优点没法抵消机能上的丧失。
第二种： with
with 通常被当作反复援用同一个对象中的多个属性的快捷体式格局，可以不须要反复援用对象自身。
举个例子：
var obj = {
a: 2,
b: 3
};
with (obj) {
console.log(a); // 2
console.log(b); // 3
c = 4;
};
console.log(c); // 4, c 被泄漏到全局作用域上如上所示，我们对 c 举行 LHS 查询，由于在 with 引入的新作用域中没有找到 c，所以向上一级作用域（这里是全局作用域）查找，也没有找到，在非严厉形式下，在全局对象中新建了一个属性 c 并赋值为 4。
with 可以将一个没有或有多个属性的对象处置惩罚为一个完整断绝的词法作用域，因而这个对象的属性也会被处置惩罚为定义在这个作用域中的词法标识符。
只管 with 块可以将一个对象处置惩罚为词法作用域，然则这个块内部一般的 var 声明并不会限定在这个块作用域中，而是被增加到 with 所处的函数作用域中。
严厉形式下，with 被完整制止运用。
'use strict';
var obj = {
a: 2,
b: 3
};
with (obj) {
console.log(a);
console.log(b);
c = 4;
};
console.log(c); 第三种： try…catch
try…catch 可以测试代码中的毛病。try 部份包括须要运转的代码，而 catch 部份包括毛病发作时运转的代码。
举个例子：
try {
foo();
} catch (err) {
console.log(err);
var a = 2;
// 打印出 "ReferenceError: foo is not defined at <anonymous>:2:4"
}
console.log(a); // 2当 try 中的代码涌现毛病时，就会进入 catch 块，此时会把非常对象增加到作用域链的最前端，相似于 with 一样，catch 中定义的局部变量也都邑增加到包括 try…catch 的函数作用域（或全局作用域）中。
4. 机能
JavaScript 引擎会在编译阶段举行数项机能优化。个中有些优化依赖于可以依据代码的词法举行静态剖析，并预先确定一切变量和函数定义的位置，才能在实行过程当中疾速找到标识符。
但假如引擎在代码中发现了 eval(…)、with 和 try…catch ，它只能简朴的假定关于标识符位置的推断都是无效的，由于没法在词法剖析阶段明白晓得 eval(…) 会接收到什么代码，这些代码会怎样对作用域举行修正，也没法晓得传递给 with 用来建立新词法作用域的对象的内容究竟是什么。
最消极的状况是假如涌现了这些动态增加作用域的代码，一切的优化可以都是无意义的，因而最简朴的做法就是完整不举行任何优化。
假如代码中大批运用 eval(…) 和 with，那末运转起来一定会变得非常迟缓。
5. 结论
许多时刻我们对代码的剖析失足，就是源于对词法作用域的疏忽，所以让我们从新审阅代码，继承勤奋！
迎接关注我的民众号
