javascript基礎拾遺——詞法範圍

本來是想寫js物件導向筆記（二）關於封裝的，但是在敲執行個體代碼的時候，發現對範圍這個東西的概念有點模糊，翻閱了犀牛後，有點感覺了，就想著先記錄下此時的感受。

　　之所以取名叫做詞法範圍，是這個概念是js中相當基礎也是極為重要的，很多想當然的錯誤或感覺怪異的問題都是和這個東西有關。所以，本文主要說下這個名詞的概念以及討論下他牽扯出來的有關變數、函數、閉包的問題。

　　1.由變數開始談

　　習慣性先來段代碼：

1 　　var x = "globol value";
2     var getValue = function(){
3         alert(x);    //彈出"undefined"
4         var x = "local value";
5         alert(x);    //彈出"local value";
6     }
7     getValue();

　　代碼很簡單，首先定義了一個全域變數x並賦了初值，然後寫了個getValue的方法，之後我們用alert彈出x的值，但是結果是undefined，不是global value也不是local value，這個我們可能會感覺到奇怪。其實理解這個問題的關鍵就是要清楚x的範圍。

　　第一個var x中的x是全域變數，說到這裡順帶說下，js解譯器在執行任何代碼之前會先建立一個全域對象（global object），全域變數就是相當於這個全域對象的一個屬性。同理，對於getValue這個函數，就會產生一個叫做調用對象的東西，局部變數就是這個調用對象的屬性，例子中第二個var x中的x就是局部變數。

　　2.主角登場

　　說了以上的東西其實是為了將本文的主角——詞法範圍。這個是何方神聖呢？要理解的話，其實我們可以對比傳統物件導向的（如JAVA、C#）中的變數的範圍，我們知道C#中的變數範圍是塊級的，即這個變數只能活動在定義他的一個直接外界內，如if子句內，for子句內定義的變數外界是無法讀取的。而js中呢，變數卻不是這樣的，在同一個函數內定義的變數其它的成員是可以訪問的。看個例子會清楚很多：

 1 　　function test(o){
 2         var i = 0;
 3         if(typeof o == "object"){
 4             var j = 0;                    
 5             for(var k=0; k < 10; k++){
 6                 document.write(k);
 7             }
 8             document.write(k);            //k是可以被訪問到的,即使他在for子句內
 9         }
10         document.write(j);                //說明j是可以被訪問到的,即使他在if子句內
11     }

　　清楚了這一點後，就來理解下js中關於詞法範圍的含義。當定義了一個函數後，當前的範圍就會被儲存下來，並且成為函數內部狀態的一部分，這個是很重要的一個概念。下面我們回到開篇的那個例子，當getValue函數被定義的時候，他的範圍被儲存起來，還有被加到範圍鏈上，他的上端就是全域執行環境。當調用getValue方法的時候，js解譯器首先會把範圍設定為定義函數的時候的那個範圍（即之前儲存那個），接下來，他在範圍的前加上調用對象即getValue這個函數，再在他的上端加上全域對象。暈了沒?還是看下我畫的圖把：

　　

　　這樣比較清楚了把，這個範圍鏈其實和原型鏈有點相似，也好似在很範圍內找不到就會向上去找。比方說開篇那個例子，找x的時候，（對了這裡要先介紹下js的預定義機制，就是js解譯器會先對var定義的變數進行初始化，應該說只是起了定義的作用當沒賦值)，會先在本範圍內找，有預定義知可以找到x，但是沒賦值，所以是undefined值。知道了這點我們來知道開篇那個代碼其實是等價於下面這個的：

1 var x = "globol value";
2     var getValue = function(){