Javascript：談談JS的全局變量跟局部變量

今天公司一個實習小妹子問我兩段JS代碼的差別：

<script type="text/javascript">  

 var a = "Hello";  

 function test(){  

      var a;  

      alert(a);  

      a = "World";  

 }  

</script>  

        我想，好簡單呀，不就是全局變量跟局部變量的scope問題嗎？我說:"當全局變量跟局部變量重名時，局部變量的scope會覆寫掉全局變量的scope，當離開局部變量的scope後，又重回到全局變量的scope。是以兩段代碼運作的結果分别為：1) undefined World 2) Hello World。然後我随意編了如下一個例子給她：

<script>  

   var a =1;  

   function test(){  

      var a = 2;  

   }  

   test();  

   alert(a);  

        大家猜結果等于多少？是輸出1 2 1 嗎？嗯嗯，當我把測試case發給她之前也是這麼認為的，但測試輸出後……運作結果是 undefined 2 1。當時百思不得其解，問了谷老師才知道，我對JS還不是非常了解，是以痛下苦功，學習+測試，總結如下：

        一、Javascript的變量的scope是根據方法塊來劃分的（也就是說以function的一對大括号｛ ｝來劃分）。切記，是function塊，而for、while、if塊并不是作用域的劃分标準，可以看看以下幾個例子：

function test2(){  

    alert ("before for scope:"+i);    // i未指派（并不是未聲明！使用未聲明的變量或函數全抛出緻命錯誤而中斷腳本執行）  

                                                    // 此時i的值是underfined  

    for(var i=0;i<3;i++){  

        alert("in for scope:"+i);  // i的值是 0、1、2, 當i為3時跳出循環  

    }  

    alert("after for scope:"+i);  // i的值是3，注意，此時已經在for scope以外，但i的值仍然保留為3  

    while(true){  

        var j = 1;  

        break;  

    alert(j);    // j的值是1，注意，此時已經在while scope以外，但j的值仍然保留為1  

    if(true){  

        var k = 1;  

    alert(k);  //k的值是1，注意，此時已經在if scope以外，但k的值仍然保留為1  

}  

test2();  

//若在此時（function scope之外）再輸出隻存在于test2 這個function scope裡的 i、j、k變量會發生神馬效果呢？  

alert(i); //error! 沒錯，是error，原因是變量i未聲明（并不是未指派，區分test2函數的第一行輸出），導緻腳本錯誤，程式到此結束！  

alert("這行列印還會輸出嗎？"); //未執行  

alert(j); //未執行  

alert(k); //未執行  

        二、Javascript在執行前會對整個腳本檔案的聲明部分做完整分析(包括局部變量)，進而确定實變量的作用域。怎麼了解呢？看下面一個例子：

    var a =1;  

    function test(){  

        alert(a); //a為undefined! 這個a并不是全局變量，這是因為在function scope裡已經聲明了（函數體倒數第4行）一個重名的局部變量,  

                     //是以全局變量a被覆寫了，這說明了Javascript在執行前會對整個腳本檔案的定義部分做完整分析,是以在函數test()執行前,  

                     //函數體中的變量a就被指向内部的局部變量.而不是指向外部的全局變量. 但這時a隻有聲明，還沒指派，是以輸出undefined。  

        a=4         

        alert(a);  //a為4,沒懸念了吧？ 這裡的a還是局部變量哦！  

        var a;     //局部變量a在這行聲明  

        alert(a);  //a還是為4,這是因為之前已把4賦給a了  

    test();  

    alert(a); //a為1，這裡并不在function scope内，a的值為全局變量的值  

        三，當全局變量跟局部變量重名時，局部變量的scope會覆寫掉全局變量的scope，當離開局部變量的scope後，又重回到全局變量的scope，而當全局變量遇上局部變量時，怎樣使用全局變量呢？用window.globalVariableName。

    function test(){     

        alert(window.a);  //a為1,這裡的a是全局變量哦！  

        var a=2;     //局部變量a在這行定義  

        alert(a);  //a為2,這裡的a是局部變量哦！  

<a></a>

本文轉自    風雨蕭條 部落格，原文連結： http://blog.51cto.com/1095221645/1873686       如需轉載請自行聯系原作者

<a href="http://blog.51cto.com/search/result?q=Javascript%EF%BC%9A%E8%B0%88%E8%B0%88JS%E7%9A%84%E5%85%A8%E5%B1%80%E5%8F%98%E9%87%8F" target="_blank">Javascript：談談JS的全局變量</a>