【Day03】语法作用域(Lexical scope)

今天要来介绍 JavaScript 的作用域，

JavaScript 是采用语法作用域(静态作用域)

首先我们先来看一个函式执行：

function callName() {
    var ming = '小明';
    console.log(ming);
}

callName();

此时显示的结果为 小明

但如果将 console.log() 放到函式外面时，

function callName() {
    var ming = '小明';
}

callName();

console.log(ming);

会显示 ReferenceError: ming is not defined，

表示 ming 没有被定义，

为什麽会这样呢？

这就跟 JavaScript 的作用域有关系了

静态作用域和动态作用域

之前有说过 JavaScript 是直译式语言，是利用直译器来生成代码後运行，

而作用域在代码解析时，就已经确定作用域了，这就是语法作用域，

也就是当我们在撰写程序码的时候，作用域就已经决定好了，

而动态作用域是在调用函式的时候，才决定作用域。

以图形表示作用域决定位置：

将上图简单整理的话变成：

1. 语法作用域(静态作用域)：

   在语法解析时，就已经确定作用域，也就是当我们在程序码写好的时候，作用域就已经决定好了。

2. 动态作用域：

   在调用函式的时候，才决定作用域。

JavaScript 作用域

JavaScript 的作用域是一层一层包着的，每一个函式都是一个作用域，而最外层是全域

当 fn1 需要使用变数，但作用域内没有该变数时，会向外查找

当外层有该变数时会直接使用，

当外层没有该变数时，会显示 ReferenceError: xxx is not defined

接下来我们看一个范例：

var value = 1;

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

function fn2() {
    var value = 2;
    fn1();
}

fn2();

该范例显示结果为 1

图解：

此时 fn1 内没有 value 这个变数，所以会向外查找，

而 JavaScript 的作用域为语法作用域，

因此 fn1 的外层为全域，而不是 fn2，所以 value 会指向全域中的值 1

但如果是动态作用域的话，那结果会显示 2

PS：这只是举例动态作用域会显示的结果而已，JavaScript 中这程序码不管执行几次都只会显示 1

因为 fn1 被 fn2 调用时，fn1 外层的作用域会变成 fn2 的作用域，因此 value 会指向 fn2 中的值 2

以上就是关於作用域的部分了，明天说明执行环境与执行堆叠的部分。