自從有了Ajax這個概念,JavaScript作為Ajax的利器,,其作用一路飆升,。JavaScript最基本的使用,,以及語法,、瀏覽器對象等等東東在這里就不累贅了。把主要篇幅放在如何實現(xiàn)JavaScript的面向?qū)ο缶幊谭矫妗?img doc360img-src='http://image10.360doc.com/DownloadImg/2010/05/2323/3307759_1.gif' alt="" src="http://image10.360doc.com/DownloadImg/2010/05/2323/3307759_1.gif">
1. 用JavaScript實現(xiàn)類 JavaScritpt沒有專門的機(jī)制實現(xiàn)類,,這里是借助它的函數(shù)允許嵌套的機(jī)制來實現(xiàn)類的,。一個函數(shù)可以包含變量,又可以包含其它函數(shù),,這樣,,變量可以作為屬性,內(nèi)部的函數(shù)就可以作為成員方法了,。因此外層函數(shù)本身就可以作為一個類了,。如下: function myClass()
這里 myClass就是一個類。其實可以把它看成類的構(gòu)造函數(shù),。至于非構(gòu)造函數(shù)的部分,,以后會詳細(xì)描述,。{ //此處相當(dāng)于構(gòu)造函數(shù) } 2. 如何獲得一個類的實例 實現(xiàn)了類就應(yīng)該可以獲得類的實例,JavaScript提供了一個方法可以獲得對象實例,。即 new操作符,。其實JavaScript中,類和函數(shù)是同一個概念,,當(dāng)用new操作一個函數(shù)時就返回一個對象,。如下: var obj1 = new myClass();
3. 對象的成員的引用 在JavaScript中引用一個類的屬性或方法的方法有以下三種。 1> 點號操作符 這是一種最普遍的引用方式,,就不累贅,。即如下形式: 對象名.屬性名;
對象名.方法名; 2> 方括號引用 JavaScript中允許用方括號引用對象的成員。如下: 對象名["屬性名"];
這里方括號內(nèi)是代表屬性或方法名的字符串,,不一定是字符串常量,。也可以使用變量。這樣就可以使用變量傳遞屬性或方法名,。為編程帶來了方便,。在某些情況下,代碼中不能確定要調(diào)用那個屬性或方法時,,就可以采用這種方式,。否則,如果使用點號操作符,,還需要使用條件判斷來調(diào)用屬性或方法,。對象名["方法名"]; 另外,使用方括號引用的屬性和方法名還可以以數(shù)字開頭,,或者出現(xiàn)空格,,而使用點號引用的屬性和方法名則遵循標(biāo)示符的規(guī)則。但一般不提倡使用非標(biāo)示符的命名方法,。 3> 使用eval函數(shù) 如果不希望使用變量傳遞變量或方法名,,又不想使用條件判斷,那么eval函數(shù)是一個好的選擇,。eval接收一個字符串類型的參數(shù),,然后將這個字符串作為代碼在上下文中執(zhí)行,返回執(zhí)行的結(jié)果,。這里正是利用了eval的這一功能,。如下: alert(eval("對象名." + element.value));
4. 對對象屬性,方法的添加,、修改和刪除操作 JavaScript中,,在生成對象之后還可以為對象動態(tài)添加、修改和刪除屬性和方法,這與其它面向?qū)ο蟮恼Z言是不同的,。 1> 添加屬性和方法 先創(chuàng)建一個對象,,空對象創(chuàng)建后沒有任何屬性和方法,然而我們可以在代碼中創(chuàng)建,。 var obj1 = new Object();
//添加屬性 obj1.ID = 1; obj1.Name = "johnson"; //添加方法 obj1.showMessage = function() { alert("ID: " + this.ID + ", Name: " + this.Name); } 2> 修改屬性與方法 與添加屬性和方法類似,,例如接著上面的例子: // 修改屬性
obj1.ID = 2; obj1.Name = "Amanda"; // 修改方法 obj1.showMessage = function() { alert("ID: " + this.ID"); } 3> 刪除屬性與方法 直接將要刪除的屬性或方法賦值為undefined即可: obj1.ID = 1;
obj1.Name = undefined; obj1.showMessage = undefined; 5. 創(chuàng)建無類型對象,。 類似于C#3.0里的Anonymous Types,,JavaScript 也可以創(chuàng)建無類型的對象,。形式如下: var obj1 = {};
這里定義了兩個無類型的對象,obj1和obj2,。其中obj1是一個空對象,。obj2包括兩個屬性ID, Name和一個方法showMessage。每個屬性和方法用逗號分割,。屬性(方法)名和其值之間用分號分割,。var obj2 = { ID: 1, Name: "Johnson", showMessage: function() { alert("ID: " + this.ID + "Name: " + this.Name); } } 用這種方式創(chuàng)建屬性方法時,也可以用字符串定義屬性方法的名字,。如: var obj2 =
{ "ID" : 1, "Name": "Johnson" } 6. prototype 每個函數(shù)對象都具有一個子對象prototype,,因為函數(shù)也可以表示類,所以prototype表示一個類的成員的集合,。當(dāng)new 一個對象時,,prototype對象的成員都會被實例化成對象的成員。先看一個例子: function myClass()
使用prototype對象創(chuàng)建類有一個好處,。如果將所有的成員直接寫在類的聲明中,,如下:{ } myClass.prototype.ID = 1; myClass.prototype.Name = "johnson"; myClass.prototype.showMessage = function() { alert("ID: " + this.ID + "Name: " + this.Name); } var obj1 = new myClass(); obj1.showMessage(); function myClass()
在上面的代碼中,定義了一個類myClass,,在類中直接定義了兩個屬性和一個方法,。然后實例化了兩個對象,這里的兩個屬性和一個方法,,每創(chuàng)建一次myClass對象都會被創(chuàng)建一次,,浪費了內(nèi)存空間。而用prototype以后就可以解決這個問題,,每new一個函數(shù)時,,其prototype對象的成員都會自動賦給這個對象,當(dāng)new多個對象時不會重復(fù)創(chuàng)建,。{ //添加屬性 this.ID = 1; this.Name = "johnson"; //添加方法 this.showMessage = function() { alert("ID: " + this.ID + ", Name: " + this.Name); } } var obj1 = new myClass(); var obj2 = new myClass(); 由于prototype的初始化發(fā)生在函數(shù)體執(zhí)行之前,用以下代碼可以證明: function myClass()
執(zhí)行以上代碼可以發(fā)現(xiàn)當(dāng)new這個類型的對象時,,即彈出了對話框,。{ //此處相當(dāng)于構(gòu)造函數(shù) this.ID = 1; this.Name1 = this.Name; this.showMessage(); } myClass.prototype.Name = "johnson"; myClass.prototype.showMessage = function() { alert("ID: " + this.ID + ", Name: " + this.Name); } var obj1 = new myClass(); 最后只得一提的是,prototype有一個方法,,在面向?qū)ο蟮脑O(shè)計中用得到,。即:constructor屬性,,是對構(gòu)造函數(shù)的調(diào)用,這里的構(gòu)造函數(shù)即上文提到的類的聲明里的代碼,。如: function myClass()
執(zhí)行以上代碼你會發(fā)現(xiàn)對話框彈出了兩次,。由此可見,prototype可專門用于設(shè)計類的成員,,實際上在JavaScript面向?qū)ο蟮脑O(shè)計中,,很多時候都會用到prototype。{ //此處相當(dāng)于構(gòu)造函數(shù) alert("this is in constructor"); } myClass.prototype.constructor(); var obj1 = new myClass(); |
|