JavaScript作用域深度剖析：动态作用域

前言

系列首发于公众号『前端进阶圈』，若不想错过更多精彩内容，请“星标”一下，敬请关注公众号最新消息。

考虑一下代码：

function foo() {
console.log(a); // 2
}

function bar() {
var a = 3;
foo();
}

var a = 2;
bar();

在上述代码中，词法作用域让 foo() 中的 a 通过 RHS 引用到了全局作用域中的 a, 因此输出 2;
在动态作用域中，它并不关心函数和作用域是如何声明以及在何处声明的，只关心他们从何处调用的。换句话说，作用域链是基于调用栈的，而不是代码中的作用域嵌套的。
如果 JavaScript 具有动态作用域，理论上，上述代码 foo() 中的 a 输出 3; 因为 foo() 是在 bar() 中调用的，
为什么会这样？
- 因为当 foo() 无法找到 a 的变量引用是，会顺着调用栈在调用 foo() 的地方查找 a，而不是在嵌套的词法作用域链中向上查找。由于 foo() 是在 bar() 中调用的，引擎会检查 bar() 的作用域，并找到值为 3 的变量 a。
是不是很奇怪？
- 但这其实是因为你可能只写过基于词法作用域的代码，因此对动态作用域感到陌生。如果你只用基于动态作用域的语言写过代码，就会觉得很自然的，而词法作用域看上去才怪怪的。
事实上 JavaScript 并不具有动态作用域，它只有词法作用域。但 this 机制的存在在某种程度上很像动态作用域。