JavaScript做用域和做用域鏈

 做用域

做用域就是變量和函數的可訪問範圍，控制着變量和函數的可見性與生命週期，在JavaScript中變量的做用域有全局做用域和局部做用域。

最外層函數定義的變量擁有全局做用域，即對任何內部函數來講，都是能夠訪問的：

var outVariable = "我是最外層變量";       //最外層變量 
function outFun() {        //最外層函數 
  var inVariable = "內層變量"; 
  function innerFun() {        //內層函數 
      console.log(inVariable); 
  } 
  innerFun(); 
} 
console.log(outVariable);     //我是最外層變量 
outFun(); //內層變量 
console.log(inVariable);    //inVariable is not defined 
innerFun();     //innerFun is not defined                         

 

<script>
      var outerVar = "outer";
      function fn(){
         console.log(outerVar);
      }
      fn();//result:outer
   </script>

局部做用域： 

和全局做用域相反，局部做用域通常只在固定的代碼片斷內可訪問到，而對於函數外部是沒法訪問的，最多見的例如函數內部

<script>
      function fn(){
         var innerVar = "inner";
      }
      fn();
      console.log(innerVar);// ReferenceError: innerVar is not defined
</script>

須要注意的是，函數內部聲明變量的時候，必定要使用var命令。若是不用的話，實際上聲明瞭一個全局變量！

<script>
      function fn(){
         innerVar = "inner";
      }
      fn();
      console.log(innerVar);// result:inner
   </script>

 

<script>
      var scope = "global";
      function fn(){
         console.log(scope);//result:undefined
         var scope = "local";
         console.log(scope);//result:local;
      }
      fn();
   </script>

 

上面這段代碼，第一個輸出竟然是undefined，本來覺得它會訪問外部的全局變量(scope=」global」)，可是並無。這能夠算是javascript的一個特色，只要函數內定義了一個局部變量，函數在解析的時候都會將這個變量「提早聲明

<script>
      var scope = "global";
      function fn(){
         var scope;//提早聲明瞭局部變量
         console.log(scope);//result:undefined
         scope = "local";
         console.log(scope);//result:local;
      }
      fn();
   </script>

做用域鏈

 

 在JS中，函數的能夠容許嵌套的。即，在一個函數的內部聲明另外一個函數，例如

function A(){
  var  a=1;
   function B(){  //在A函數內部，聲明瞭函數B，這就是所謂的函數嵌套。
         var b=2;   
   }
}

 對於A來講，A函數在執行的時候，會建立其A函數的做用域， 那麼函數B在建立的時候，會引用A的做用域，相似下面這樣

 

函數B在執行的時候，其做用域相似於下面這樣：

 從上面的兩幅圖中能夠看出，函數B在執行的時候，是會引用函數A的做用域的。因此，像這種函數做用域的嵌套就組成了所謂的函數做用域鏈。

當在自身做用域內找不到該變量的時候，會沿着做用域鏈逐步向上查找，若在全局做用域內部仍找不到該變量，則會拋出異常。