javaScript 作用域

在MDN或者其他權威教程上，對於作用域的解釋無一例外是與可見性和生命週期相關。

作為最重要的概念之一，初學者往往會惑於上述高大上的理論闡述。

所以從淺顯處入手，可能更有助於對於概念的入門和深入理解。

作用域通俗的講就是變數或者函式的“勢力範圍”，在此範圍內，變數可以被引用，函式可以被呼叫。

JavaScript具有兩種作用域：

（1）.全域性作用域。

（2）.函式作用域。

特別說明：ES2015新增塊級作用域，具體可以參閱JavaScript 塊級作用域一章節。

函式中宣告的變數是區域性變數，當然必須使用var宣告，否則也是一個全域性變數，程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
function func(){
  var webName="螞蟻部落";
  address="青島市南區";
}

兩個變數雖然都是在函式中宣告，但webName是區域性變數，address是全域性變數。

全域性變數在整個程式碼中都是可見的，區域性變數僅能在宣告變數的函式（包括巢狀在其中的函式）中使用。

再來看一段程式碼：

[JavaScript] 純文字檢視 複製程式碼
function func(){
  var webName="螞蟻部落";
   
  function funcInner(){
    var target="分享互助";
  }
}

變數webName可以在函式func和funcInner中應用，但變數target只能夠在funcInner中使用。

全域性變數是window物件的屬性，"勢力範圍"是整個程式碼。

程式碼例項如下：

[JavaScript] 純文字檢視 複製程式碼執行程式碼
var antzone="分享互助";
function func(){
  var webName="螞蟻部落";
}
console.log(window.antzone);

作用域鏈:

作用域鏈是查詢一個變數的時候，一層一層的向上形成的查詢軌跡，類似於一個鏈子一樣。

程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼執行程式碼
var antzone="螞蟻部落";
function box(){
  var a="box函式";
  function middle(){
    var b="middle函式";
    function inner(){
      console.log(antzone);
    }
    inner();
  }
  middle();
}
box();

將要列印antzone時，首先會在當前inner函式作用域中查詢，沒有找到，則向上在middle函式作用域中查詢，沒有查詢到，再向上在box中查詢。依然沒有查詢到，最後在全域性作用域中查詢，這樣就形成作用域鏈效果。

更多關於作用域鏈內容可以參閱JavaScript作用域連結一章節。