Javascript 學習書 推薦

Aaron Gustafson著，李松峰 李雅雯 等譯。感覺絕對是一本值得看的書。感興趣的朋友可以看一下。下面是我從其中抽出來的javascript常見陷阱和對象的概念整理出來的。希望對大家能有一些協助。

Ø Javascript文法中常見的陷阱

² 區分大小寫

² 單引號和雙引號實際上是沒有特殊的區別的，這點我是從看了這本書才開始真正的知道，雖然在以前寫程式時寫過‘'號的字串形式，但是卻沒有先覺性的發現“哦，原來這樣也可以。”

另外大多數情況下還都是用‘'來表示字串的，因為XHTML規範要求所有XHTML 屬性值都用“”括起來。這樣混合代碼時會很清晰。

² 換行，千萬不要忽略這一點。因為如果在一個字串中你用了斷行符號做換行那麼對不起了，瀏覽器會告訴你我不認識你的字串。因為它會自動將斷行符號轉換成”;“但是為瞭解決這個問題，還好它提供了一個逸出字元作為替代。如下所示：

var='<h2 class=”a”>A list</h2>\

<ol>\

<li class=”a”></li>\

</ol>'

有人會說可以用加號的，這些我知道。用加號作為字串的操作符。估計是底層進行了+號的重載（？！）。

² 可選的分號和花括弧

如果你不相信，我告訴你這是可以的。可以說這點javascript做的還是比較智能的。但是和前述那本書作者一樣，我想我們做程式員還是規規矩矩些比較好。

² 重載

有時候或許你會突發奇想曲做一個javascript的重載函數，你會發現這時候竟然只有最後一個可以運行，前面的都沒有得到錄用機會。這是什麼原因呢？

原來，先前的某某已經被後面的給替換掉了。也就是通常說的覆蓋。再進一步說就是程式只引用範圍鏈中的最後一個同名函數。

² 匿名函數

不得不說這個傢伙很有用。

² 範圍解析和閉包

這個範圍相信大家都比較熟悉，因為每個程式設計語言都有這樣的概念。

而範圍鏈是用來描述一種路徑的屬於，沿著該路徑可以確定變數的值（或者當函數被調用時要使用的方法）

閉包是與範圍相關的一個概念，它指的是內建函式即使在外部哈數執行完成並終止以後，仍然可以訪問其外部函數的屬性。當引用一個變數或方法時，javascript會沿著由對象執行路徑構成的範圍鏈進行解析，尋找變數最近定義的值。一旦找到，即使用該值。

² 迭代對象

不要懷疑這用的不好的話，很可能會產生錯誤。不信就看這一個例子：

var all=document.getElementsByTagName(‘*');

for(i in all){

//對all[i]元素進行操作。

}

由於返回的會分別等於length、item和namedItem，而這個很可能會導致代碼中出現意外錯誤。

這時要做一下處理。用hasOwnProperty進行屬性過濾，這個函數在對象的屬性或方法是非繼承的時返回true。方法如下：

var all=document.getElementsByTagName(‘*');

for(i in all){

if(!all.hasOwnProperty(i)){continue;}

//對all[i]元素進行操作。

}

² 函數的調用和引用。

注意了，這是不同的，調用會執行，引用只會給變數一個copy（好像可以這樣理解吧？）

看下這個：

var foo=exampleFunction（）；

var foo=exampleFunction；

這兩句式不一樣的。前一個是執行exampleFunction這個函數並將傳回值賦給變數foo，而後一個卻是將exampleFunction這個函數的引用賦給foo。

Ø Javascript對象

屬性和方法的概念相信大家都曉得。下面講下javascript中的對象和其中的玄奧妙義(講的跟武俠似的)。

1. 繼承

Javascript的繼承讓我很奇怪，但是想過之後感覺還是有道理的。而且和其他的還是一樣的思想。其實javascript就是做了一個複製的操作。閑話不說看一個例子相信大家都會清楚了。

//建立一個person對象的執行個體

var person={};

person.getName=function(){……};

person.getAge=function(){……};

//建立一個employee對象的執行個體

var employee={};

employee.getTitle=function(){……};

enployee.getSalary=function(){……};
//從person對象中繼承方法

employee.getName=person.getName;

employ.getAge=person.getAge;

2. 建立自己的對象

有兩種方式可以建立自己的對象：

第一種：var myObject =new Object();

第二種：var myObject={};//是第一種的簡寫形式。實際上面已經用到了。

3. 建立建構函式

第一種：function myConstructor(a){

//代碼

}

不要驚訝，想象前面說的javascript中到處都是對象，雖然有些誇張。這個函數一時一個對象。

第二種：

或許聰明的讀者已經猜出來了，就是函數定義的另外兩種類型：

var myConstructor=function(a){};

第三種也一起寫出來吧：var myConstructor=new Function(‘a',/*某些代碼*/);

不過對於這種方式，因為會導致效能問題，所以還是用function比較妥當。

最後給個書中的例子：

function myConstructor(message){

alert(message);

this.myMessage=message;

}

var myObject =new myConstructor(‘Instantiating myObject!');

4. 添加靜態方法

var myObject={};

//添加屬性

myObject.name=”Jeff”;

//添加方法

myObject.alertName=function(){

alert(this.name);

}

//執行方法

myObject.alertName();

相信大家都能看明白，不說了。

5. 想原型中添加公有方法

添加公有方法的方式是用prototype，注意這裡的prototype可不是那個js庫。

//建立建構函式

function myConstructor(message){

alert(message);

this.myMessage=message;

}

//添加一個公有方法

myConstructor.prototype.clearMessage=function(string){

this.myMessage+=''+string;

}

這裡面要提的一點是 建構函式中凡是以var開頭的變數全部是私人變數，不是以.號和prototype添加而是直接寫入建構函式中的為私人函數。

6. 最後提一下對象字面量

對象字面量對於代碼的重構，冗餘度的減小都很有協助。所以如果可能的話最好用這種

看下下面的例子：

var myObject={

propertyA:'value',

propertyB:'value'，

methodA:function(){}

}

不得不同意作者的觀點，這種方式很優雅。

怎麼樣？是不是對Javascript中的對象和陷阱有了一些基本的認識？希望這篇文章對你有所協助。