javascript作用域和作用域鏈簡單介紹

只要是一門程式語言，那麼作用域就是一個不可逃避的問題，下面就通過例項簡單介紹一下javascript的作用域和作用域鏈。

在javascript中，作用域分為兩種:

1.全域性作用域

2.區域性作用域。

如何界定是何種作用域:

1.定義在所有函式之外的變數是具有全域性作用域。

2.定義在函式之內的變數具有區域性作用域，它的作用域就是變數所在的函式。

特別說明:所有末定義直接賦值的變數具有全域性作用域。

作用域與作用域之間是可以層層包含的：

全域性作用域可以包含區域性作用域，區域性作用域中又可以巢狀其他區域性作用域，可以如此無限的巢狀下去。

面羅列幾個例項加深一下對概念的理解:

例項一:

[HTML] 純文字檢視 複製程式碼
<script type="text/javascript">
 var x="全域性變數x";
 var y="全域性變數y";
  
 function myfunction(){
  var x="區域性變數x";
  var z="區域性變數z";
  alert(x);//彈出"區域性變數x"
  alert(y);//彈出"全域性變數y"
 }
  
 myfunction();
alert(z);//不能彈出內容。
</script>

在以上程式碼中，當執行myfunction()函式的時候能夠分別彈出”區域性變數x“和"區域性變數y"。但是alert(z)不能彈出內容，因為z變數是定義在函式內的區域性變數，不能夠在函式體外使用。

從上面的程式碼可以對區域性變數和全域性變數有一個基本的瞭解，要特別主要的是，如果區域性變數和全域性變數同名，那麼區域性變數將會覆蓋全域性變數，具體原因在後面有介紹。

例項二:

[HTML] 純文字檢視 複製程式碼
<script type="text/javascript">
 var x="全域性變數x";
 var y="全域性變數y";
  
 function myfunction(){
  var x="區域性變數x";
  var z="區域性變數z";
  m="全域性變數m";
  alert(x);//彈出"區域性變數x"
  alert(y);//彈出"全域性變數y"
 }
 myfunction();
 alert(m);//彈出"全域性變數m"
</script>

在以上程式碼中，當執行myfunction()函式的時候能夠分別彈出”區域性變數x“和"區域性變數y"。alert(m)能夠彈出"全域性變數m"，儘管m是在函式體內宣告並賦值的，但是並沒有使用var關鍵字，所以變數m的作用域是全域性的。

例項三:

[HTML] 純文字檢視 複製程式碼
<script type="text/javascript">
 var x="全域性變數x";
 var y="全域性變數y";
  
 function myfunction(){
  var x="區域性變數x";
  var z="區域性變數z";
  m="全域性變數m";
  alert(x);//彈出"區域性變數x"
  alert(y);//彈出"全域性變數y"
  function innerfunction(){
    var xx="區域性變數xx";
    alert(xx);//彈出"區域性變數xx"
    alert(z);//彈出"區域性變數z"
  }
  innerfunction();
  alert(xx)//無法彈出
 }
 myfunction();
 alert(m);//彈出"全域性變數m"
</script>

以上程式碼中，進行了函式的巢狀，也就是實現了作用域的巢狀。執行結果這裡就不一一介紹了，和上面原理是一樣的，需要特別說明的是，alert(xx)之所以不能夠彈出內容，因為xx變數的作用域是innerfunction()函式，並且在myfunction()函式和全域性作用都沒有關於xx變數的宣告。

經過上面的幾個例項以後，對作用域有了初步的瞭解，下面再來介紹一下javascript的變數的查詢機制，就能明白為什麼看起來同名的區域性變數能夠覆蓋全域性變數。

以例項三作為一個例子，innerfunction()函式的alert(z)語句，這個時候就首先在innerfunction()函式作用域內查詢，如果不存在，則向上在myfunction()函式作用域中查詢，如果有就彈出變數值，沒有則繼續向上查詢，如此則形成了一個作用域鏈。

特別說明:在javascript中不具有塊級作用域，例如for迴圈語句不能形成一個作用。