從頭開始學JavaScript (二)——變量及其作用域

一、變量

ECMAscript變量是松散型變量，所謂松散型變量，就是變量名稱可以保存任何類型的數據，每個變量僅僅是一個用於保存值的占位符。

定義：var firstDemo;

二、變量的作用域

2.1基本概念

使用var 定義變量：定義該變量的作用域的局部變量，這種定義變量的方法也被成為顯式聲明。

這么說不理解的話可以看看下面這個簡單粗暴的例子：

test();
function test(){
var firstDemo="hello";//定義局部變量
    alert(firstDemo);//hello

}

 test();
 function test(){
    var firstDemo="hello";//定義局部變量firstDemo            
 }    
 alert(firstDemo);//報錯，firstDemo is not define

由以上兩個例子可以看出，如果在一個函數中使用var 定義一個變量，那么該變量在函數退出后會被銷毀。

省略var 定義變量：只要調用一次定義該變量的函數，全局范圍內都可訪問該變量。這種定義變量的方法也被成為隱式聲明

 <script type="text/javascript">
        test();
        alert(firstDemo);   //hello 
        function test(){
             firstDemo="hello";            
        }        
    </script>

tips:顯式聲明的變量是在預編譯時就已經編譯到調用對象中了，（例如var t=1;預編譯時執行var t;解釋時執行t=1;）不同於隱式聲明變量在解釋時才被定義為全局變量。

弄清楚變量的作用域，可以幫助我們思考如何合理聲明變量，這樣既減小了不必要的內存開銷，同時能很大程度地避免變量重復定義而覆蓋先前定義的變量所造成的麻煩。

2.2作用域分析

<script type="text/javascript">
    function demoFunction(s){ 
        document.writeln(s) 
    } 
    var i=0; //定義全局變量 
    function test(){ 
        demoFunction(i); 
        function innerFunction(){ 
            var i = 1; //定義局部變量 
            demoFunction(i); 
        } 
        innerFunction(); 
        demoFunction(i); 
   } 
   test();    
</script>

輸出結果：0 1 0

<script type="text/javascript">
　　function demoFunction(s){ 
　　　　document.writeln(s) 
} 

　　var i=0;
　　function test(){
　　　　demoFunction(i);
　　　　function innerFunction(){
　　　　　　demoFunction(i);
　　　　　　var i=1;
　　　　demoFunction(i);
　　　　}
　　　　innerFunction();
　　　　demoFunction(i);
}
test();

</script>

輸出結果：

A、0 0 1 0

B、0 undefined 1 0

C、0 報錯i is not defined 

各位可以猜測一下結果是哪一個，原因會在留言里詳解。