• 變量作用域
  • 作用域介紹
    • 靜態(tài)作用域
    • 動態(tài)作用域
  • JavaScript 變量作用域
    • 詞法環(huán)境
      • 組成
      • 創(chuàng)建
      • 結(jié)構(gòu)
    • 關(guān)于詞法環(huán)境的問題
    • with 語句
    • try-catch 句法
    • 帶名稱的函數(shù)表達(dá)式

變量作用域

變量的作用域值的是變量的生命周期和作用范圍（全局與局部作用域的區(qū)別）。

作用域介紹

靜態(tài)作用域

靜態(tài)作用域有稱為詞法作用域，即指其在編譯的階段就可以決定變量的引用。靜態(tài)作用域只更變量定義的位置有關(guān)與代碼執(zhí)行的順序無關(guān)。

var x = 0;
function foo() {
  alert(x);
}

function bar() {
  var x = 20;
  foo();
}

foo();

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-lexical-scope.png" alt="" />

動態(tài)作用域

動態(tài)作用域的變量引用只可在程序運(yùn)行時(shí)刻決定（其通常通過動態(tài)棧來進(jìn)行管理）。

var x = 0;
function foo() {
  alert(x);
}

function bar() {
  var x = 20;
  foo();
}

foo();

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-dynamic-scope.gif" alt="" />

JavaScript 變量作用域

JavaScript （1）使用靜態(tài)作用域，（2）其沒有塊級作用域（只有函數(shù)作用域，就是只有 function 用于可以定義作用域），（3）在 ES5 之作使用詞法環(huán)境來管理作用域。

詞法環(huán)境

組成

詞法環(huán)境用來描述靜態(tài)作用域的數(shù)據(jù)結(jié)構(gòu)。它由環(huán)節(jié)記錄和外部詞法環(huán)境的引用組成。

• 環(huán)境記錄（record）（指形參，變量，函數(shù)等）
• 外部詞法環(huán)境的引用（outer）

創(chuàng)建

在一段代碼執(zhí)行之前，先初始化詞法環(huán)境。會被初始化的有：

• 形參
• 函數(shù)定義（創(chuàng)建函數(shù)對象，會保存當(dāng)前作用域。見下圖）
• 變量定義（所有初始化值均為 undefined）

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-function-init.png" alt="" />

結(jié)構(gòu)

var x = 10;
function foo(y) {
  var z = 30;
  function bar(q) {
    return x + y + z + q;
  }
  return bar;
}
var bar = foo(20);
bar(40);

全局詞法作用域（初始化狀態(tài)）

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-global-init.png" alt="" />

函數(shù)詞法作用域

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-structure.jpg" alt="" />

關(guān)于詞法環(huán)境的問題

命名沖突

形參，函數(shù)定義，變量名稱命名沖突。其中的優(yōu)先級的排序如下：

函數(shù)定義 > 形參 > 變量

arguments 的使用

為函數(shù)中定義好的變量。

函數(shù)表達(dá)式與函數(shù)定義的區(qū)別

• 函數(shù)表達(dá)式是在執(zhí)行時(shí)才創(chuàng)建函數(shù)對象。
• 函數(shù)定義為在代碼執(zhí)行之前就進(jìn)行創(chuàng)建的。

with 語句

with 會創(chuàng)造一個(gè)臨時(shí)作用域。

var foo = 'abc';
with({
  foo: 'bar';
}) {
  function f() {
    alert(foo);
  };
  (function() {
    alert(foo);
  })();
  f();
}

try-catch 句法

try {
  var e = 10;
  throw new Error();
} catch (e) {
  function f() {
    alert(e);
  }
  (function() {
    alert(e);
  })();
  f();
}

帶名稱的函數(shù)表達(dá)式

當(dāng)一個(gè)函數(shù)表達(dá)式有了名稱之后，JavaScript 會創(chuàng)建一個(gè)新的詞法環(huán)境。并在這個(gè)詞法環(huán)境中用有一個(gè)屬性 A 指向這個(gè)函數(shù)，同時(shí)這個(gè)屬性 A 指向的函數(shù)是不可被修改的。

下面例子為不常規(guī)的寫法

(function A(){
  A = 1;
  alert(A);
})();

http://wiki.jikexueyuan.com/project/fend_note/images/S/scope-function-with-name.png" alt="" />