看了很多介紹javascript面向?qū)ο蠹夹g(shù)的文章,很暈.為什么?不是因?yàn)閷懙貌缓?而是因?yàn)樘願(yuàn)W.javascript中的對(duì)象還沒(méi)解釋清楚怎么回事,一上來(lái)就直奔主題,類/繼承/原型/私有變量。結(jié)果呢,看了大半天,有了一個(gè)大概的了解,細(xì)細(xì)一回味,好像什么都沒(méi)懂。

這篇文章是參考<<javascript-the definitive guide,5th edition>>第7,8,9章而寫成的,我也會(huì)盡量按照原書的結(jié)構(gòu)來(lái)說(shuō)明javascript的面向?qū)ο蠹夹g(shù)(對(duì)象/數(shù)組->函數(shù)-->類/構(gòu)造函數(shù)/原型).對(duì)一些我自己也拿捏不準(zhǔn)的地方,我會(huì)附上原文的英文語(yǔ)句,供大家參考.

如果不做說(shuō)明,則文中出現(xiàn)的所有英文語(yǔ)句(程序體除外)都是引自<<javascript-the definitive guide,5th edition>>.

對(duì)象和數(shù)組(Objects and Arrays)

什么是對(duì)象?把一些"名字-屬性"的組合放在一個(gè)單元里面,就組成了一個(gè)對(duì)象.我們可以理解為javascript中的對(duì)象就是一些"鍵-值"對(duì)的集合(An object is a collection of named values. These named values are usually referred
to as properties of the object.--Section3.5).

"名字"只能是string類型,不能是其他類型,而屬性的類型則是任意的(數(shù)字/字符串/其他對(duì)象..).可以用new Object()來(lái)創(chuàng)建一個(gè)空對(duì)象,也可以簡(jiǎn)單的用"{}"來(lái)創(chuàng)建一個(gè)空對(duì)象,這兩者的作用是等同的.

Js代碼

var emptyObject1 = {}; //創(chuàng)建空對(duì)象     
var emptyObject2 = new Object(); //創(chuàng)建空對(duì)象     
var person = {"name":"sdcyst",     
"age":18,     
"sex":"male"}; //創(chuàng)建一個(gè)包含初始值的對(duì)象person     
alert(person.name); //sdcyst     
alert(person["age"]); //18  

從上面的例子我們也可以看到，訪問(wèn)一個(gè)對(duì)象的屬性，可以簡(jiǎn)單的用對(duì)象名加"."后加屬性的名字，也可以用"[]"操作符來(lái)獲取,此時(shí)在[]里面的屬性名字要加引號(hào),這是因?yàn)閷?duì)象中的索引都是字符串類型的.javasript對(duì)象中屬性的個(gè)數(shù)是可變的,在創(chuàng)建了一個(gè)對(duì)象之后可以隨時(shí)對(duì)它賦予任何的屬性.

Js代碼：

var person = {};  
person.name = "sdcyst";  
person["age"] = 18;  
alert(person.name + "__" + person.age); //sdcyst__18  
var _person = {name:"balala","age":23}; //在構(gòu)建一個(gè)對(duì)象時(shí),屬性的名字可以不用引號(hào)來(lái)標(biāo)注(name),  
//但是仍舊是一個(gè)字符串類型.在訪問(wèn)的時(shí)候[]內(nèi)仍舊需要引號(hào)  
alert(_person["name"] + "__" + person.age); //balala__23  
alert(_person[name]); //undefinied  

通過(guò)"."操作符獲取對(duì)象的屬性,必須得知道屬性的名字.一般來(lái)說(shuō)"[]"操作符獲取對(duì)象屬性的功能更強(qiáng)大一些,可以在[]中放入一些表達(dá)式來(lái)取屬性的值，比如可以用在循環(huán)控制語(yǔ)句中,而"."操作符則沒(méi)有這種靈活性。

Js代碼：

var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};  
var namestring = "";  
for(var props in name) { //循環(huán)name對(duì)象中的屬性名字  
namestring += name[props];  
}  
alert(namestring); //NAME1NAME2NAME3NAME4  
namestring = "";  
for(var i=0; i<4; i++) {  
namestring += name["name"+(i+1)];  
}  
alert(namestring); //NAME1NAME2NAME3NAME4  

delete操作符可以刪除對(duì)象中的某個(gè)屬性,判斷某個(gè)屬性是否存在可以使用"in"操作符.

Js代碼：

var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};  
var namestring = "";  
for(var props in name) { //循環(huán)name對(duì)象中的屬性名字  
namestring += name[props];  
}  
alert(namestring); //NAME1NAME2NAME3NAME4  
delete name.name1; //刪除name1屬性  
delete name["name3"]; //刪除name3屬性  
namestring = "";  
for(var props in name) { //循環(huán)name對(duì)象中的屬性名字  
namestring += name[props];  
}  
alert(namestring); //NAME2NAME4  
alert("name1" in name); //false  
alert("name4" in name); //true 

需要注意,對(duì)象中的屬性是沒(méi)有順序的.

對(duì)象的constructor屬性

每一個(gè)javascript對(duì)象都有一個(gè)constructor屬性.這個(gè)屬性對(duì)應(yīng)了對(duì)象初始化時(shí)的構(gòu)造函數(shù)(函數(shù)也是對(duì)象).

Js代碼：

var date = new Date();   
alert(date.constructor); //Date   
alert(date.constructor == "Date"); //false   
alert(date.constructor == Date); //true  

 【編輯推薦】

1. Javascript中閉包的作用域鏈
2. 為你的網(wǎng)站添加上JavaScript禁用提示頁(yè)面吧
3. Javascript的興起是否意味著LAMP的終結(jié)？
4. Javascript解決瀏覽器兼容性問(wèn)題