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

Ø Javascript語法中常見的陷阱

² 區(qū)分大小寫

² 單引號和雙引號實(shí)際上是沒有特殊的區(qū)別的，這點(diǎn)我是從看了這本書才開始真正的知道，雖然在以前寫程序時(shí)寫過‘'號的字符串形式，但是卻沒有先覺性的發(fā)現(xiàn)“哦，原來這樣也可以?！?

另外大多數(shù)情況下還都是用‘'來表示字符串的，因?yàn)閄HTML規(guī)范要求所有XHTML屬性值都用“”括起來。這樣混合代碼時(shí)會很清晰。

² 換行，千萬不要忽略這一點(diǎn)。因?yàn)槿绻谝粋€(gè)字符串中你用了回車做換行那么對不起了，瀏覽器會告訴你我不認(rèn)識你的字符串。因?yàn)樗鼤詣訉⒒剀囖D(zhuǎn)換成”;“但是為了解決這個(gè)問題，還好它提供了一個(gè)轉(zhuǎn)義字符作為替代。如下所示：

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

<ol>\

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

</ol>'

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

² 可選的分號和花括號

如果你不相信，我告訴你這是可以的?？梢哉f這點(diǎn)javascript做的還是比較智能的。但是和前述那本書作者一樣，我想我們做程序員還是規(guī)規(guī)矩矩些比較好。

² 重載

有時(shí)候或許你會突發(fā)奇想曲做一個(gè)javascript的重載函數(shù)，你會發(fā)現(xiàn)這時(shí)候竟然只有最后一個(gè)可以運(yùn)行，前面的都沒有得到錄用機(jī)會。這是什么原因呢？

原來，先前的某某已經(jīng)被后面的給替換掉了。也就是通常說的覆蓋。再進(jìn)一步說就是程序只引用作用域鏈中的最后一個(gè)同名函數(shù)。

² 匿名函數(shù)

不得不說這個(gè)家伙很有用。

² 作用域解析和閉包

這個(gè)作用域相信大家都比較熟悉，因?yàn)槊總€(gè)編程語言都有這樣的概念。

而作用域鏈?zhǔn)怯脕砻枋鲆环N路徑的屬于，沿著該路徑可以確定變量的值（或者當(dāng)函數(shù)被調(diào)用時(shí)要使用的方法）

閉包是與作用域相關(guān)的一個(gè)概念，它指的是內(nèi)部函數(shù)即使在外部哈數(shù)執(zhí)行完成并終止以后，仍然可以訪問其外部函數(shù)的屬性。當(dāng)引用一個(gè)變量或方法時(shí)，javascript會沿著由對象執(zhí)行路徑構(gòu)成的作用域鏈進(jìn)行解析，查找變量最近定義的值。一旦找到，即使用該值。

² 迭代對象

不要懷疑這用的不好的話，很可能會產(chǎn)生錯誤。不信就看這一個(gè)例子：

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

for(i in all){

//對all[i]元素進(jìn)行操作。

}

由于返回的會分別等于length、item和namedItem，而這個(gè)很可能會導(dǎo)致代碼中出現(xiàn)意外錯誤。

這時(shí)要做一下處理。用hasOwnProperty進(jìn)行屬性過濾，這個(gè)函數(shù)在對象的屬性或方法是非繼承的時(shí)返回true。方法如下：

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

for(i in all){

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

//對all[i]元素進(jìn)行操作。

}

² 函數(shù)的調(diào)用和引用。

注意了，這是不同的，調(diào)用會執(zhí)行，引用只會給變量一個(gè)copy（好像可以這樣理解吧？）

看下這個(gè)：

var foo=exampleFunction（）；

var foo=exampleFunction；

這兩句式不一樣的。前一個(gè)是執(zhí)行exampleFunction這個(gè)函數(shù)并將返回值賦給變量foo，而后一個(gè)卻是將exampleFunction這個(gè)函數(shù)的引用賦給foo。

Ø Javascript對象

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

1. 繼承

Javascript的繼承讓我很奇怪，但是想過之后感覺還是有道理的。而且和其他的還是一樣的思想。其實(shí)javascript就是做了一個(gè)復(fù)制的操作。閑話不說看一個(gè)例子相信大家都會清楚了。

//創(chuàng)建一個(gè)person對象的實(shí)例

var person={};

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

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

//創(chuàng)建一個(gè)employee對象的實(shí)例

var employee={};

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

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

employee.getName=person.getName;

employ.getAge=person.getAge;

2. 創(chuàng)建自己的對象

有兩種方式可以創(chuàng)建自己的對象：

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

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

3. 創(chuàng)建構(gòu)造函數(shù)

第一種：function myConstructor(a){

//代碼

}

不要驚訝，想象前面說的javascript中到處都是對象，雖然有些夸張。這個(gè)函數(shù)一時(shí)一個(gè)對象。

第二種：

或許聰明的讀者已經(jīng)猜出來了，就是函數(shù)定義的另外兩種類型：

var myConstructor=function(a){};

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

不過對于這種方式，因?yàn)闀?dǎo)致性能問題，所以還是用function比較妥當(dāng)。

最后給個(gè)書中的例子：

function myConstructor(message){

alert(message);

this.myMessage=message;

}

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

4. 添加靜態(tài)方法

var myObject={};

//添加屬性

myObject.name=”Jeff”;

//添加方法

myObject.alertName=function(){

alert(this.name);

}

//執(zhí)行方法

myObject.alertName();

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

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

添加公有方法的方式是用prototype，注意這里的prototype可不是那個(gè)js庫。

//創(chuàng)建構(gòu)造函數(shù)

function myConstructor(message){

alert(message);

this.myMessage=message;

}

//添加一個(gè)公有方法

myConstructor.prototype.clearMessage=function(string){

this.myMessage+=''+string;

}

這里面要提的一點(diǎn)是 構(gòu)造函數(shù)中凡是以var開頭的變量全部是私有變量，不是以.號和prototype添加而是直接寫入構(gòu)造函數(shù)中的為私有函數(shù)。

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

對象字面量對于代碼的重構(gòu)，冗余度的減小都很有幫助。所以如果可能的話最好用這種

看下下面的例子：

var myObject={

propertyA:'value',

propertyB:'value'，

methodA:function(){}

}

不得不同意作者的觀點(diǎn)，這種方式很優(yōu)雅。

怎么樣？是不是對Javascript中的對象和陷阱有了一些基本的認(rèn)識？希望這篇文章對你有所幫助。

最新評論