欢迎关注微信公众号：前端阅读室

作用域

作用域是变量和函数的可访问范围。

作用域决定了变量和函数的有权访问和有序访问。

JavaScript 采用词法作用域(lexical scoping)，也就是静态作用域。

静态作用域与动态作用域

JavaScript 采用的是静态作用域(词法作用域)，函数的作用域在函数定义的时候就决定了。

与静态作用域相对的是动态作用域，函数的作用域是在函数调用的时候才决定的。

我们看个例子：

var value = 1;

function foo() {
  console.log(value);
}

function bar() {
  var value = 2;
  foo();
}

bar();

结果会打印什么呢？答案是：1。

我们来分析一下执行过程：

在执行 foo 函数时，先从 foo 函数内部查找是否有局部变量 value。发现没有，然后根据函数书写的位置，查找上一层代码，也就是 value = 1，所以打印的结果是 1。

所以 JavaScript 采用的是静态作用域，如果是动态作用域的话，它会从调用 foo 函数的作用域，也就是 bar 函数的作用域查找 value 变量，那么打印的结果就是 2 了。

我们再看个动态作用域的例子：

value=1
function foo () {
    echo $value;
}
function bar () {
    local value=2;
    foo;
}
bar

猜猜执行这段 bash 代码，输出的结果会是什么？

答案是：2。因为 bash 是动态作用域。

学习了词法作用域和动态作用域，大家能猜出下面这两段代码分别会打印什么吗？

var scope = "global scope";
function checkscope() {
  var scope = "local scope";
  function f() {
    return scope;
  }
  return f();
}
checkscope();

var scope = "global scope";
function checkscope() {
  var scope = "local scope";
  function f() {
    return scope;
  }
  return f;
}
checkscope()();

如果大家已经知道了打印的结果，那么能进一步思考一下这两段代码在执行过程中有什么不同吗？关于这个问题，只知道词法作用域的知识是不够的，我们会在下一节讲执行上下文栈的时候详细解答。

欢迎关注微信公众号：前端阅读室