日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

解讀JavaScript中類的實(shí)現(xiàn)_AJAX教程

編輯Tag賺U幣
教程Tag:暫無Tag,歡迎添加,賺取U幣!

推薦:AJAX入門--概述XMLHttpRequest
在使用XMLHttpRequest對(duì)象發(fā)送請(qǐng)求和處理響應(yīng)之前,必須先用JavaScript創(chuàng)建一個(gè)XMLHttpRequest對(duì)象。由于XMLHttpRequest不是一個(gè)W3C標(biāo)準(zhǔn),所以可以采用多種方法使用JavaScript來創(chuàng)建XMLHttpRequest的實(shí)例。Internet Explorer把XMLHttpRequest實(shí)現(xiàn)為一個(gè)Active

在JavaScript中可以使用function關(guān)鍵字來定義一個(gè)“類”,如何為類添加成員。在函數(shù)內(nèi)通過this指針引用的變量或者方法都會(huì)成為類的成員,例如:

function class1(){
 var s="abc";
 this.p1=s;
 this.method1=function(){
  alert("this is a test method");
 }
}
var obj1=new class1();

  通過new class1()獲得對(duì)象obj1,對(duì)象obj1便自動(dòng)獲得了屬性p1和方法method1。

  在JavaScript中,function本身的定義就是類的構(gòu)造函數(shù),結(jié)合前面介紹過的對(duì)象的性質(zhì)以及new操作符的用法,下面介紹使用new創(chuàng)建對(duì)象的過程。

 �。�1)當(dāng)解釋器遇到new操作符時(shí)便創(chuàng)建一個(gè)空對(duì)象;

 �。�2)開始運(yùn)行class1這個(gè)函數(shù),并將其中的this指針都指向這個(gè)新建的對(duì)象;

  (3)因?yàn)楫?dāng)給對(duì)象不存在的屬性賦值時(shí),解釋器就會(huì)為對(duì)象創(chuàng)建該屬性,例如在class1中,當(dāng)執(zhí)行到this.p1=s這條語句時(shí),就會(huì)添加一個(gè)屬性p1,并把變量s的值賦給它,這樣函數(shù)執(zhí)行就是初始化這個(gè)對(duì)象的過程,即實(shí)現(xiàn)構(gòu)造函數(shù)的作用;

 �。�4)當(dāng)函數(shù)執(zhí)行完后,new操作符就返回初始化后的對(duì)象。

  通過這整個(gè)過程,JavaScript中就實(shí)現(xiàn)了面向?qū)ο蟮幕緳C(jī)制。由此可見,在JavaScript中,function的定義實(shí)際上就是實(shí)現(xiàn)一個(gè)對(duì)象的構(gòu)造器,是通過函數(shù)來完成的。這種方式的缺點(diǎn)是:

  ·將所有的初始化語句、成員定義都放到一起,代碼邏輯不夠清晰,不易實(shí)現(xiàn)復(fù)雜的功能。

  ·每創(chuàng)建一個(gè)類的實(shí)例,都要執(zhí)行一次構(gòu)造函數(shù)。構(gòu)造函數(shù)中定義的屬性和方法總被重復(fù)的創(chuàng)建,例如:

this.method1=function(){
 alert("this is a test method");
}


  這里的method1每創(chuàng)建一個(gè)class1的實(shí)例,都會(huì)被創(chuàng)建一次,造成了內(nèi)存的浪費(fèi)。下一節(jié)介紹另一種類定義的機(jī)制:prototype對(duì)象,可以解決構(gòu)造函數(shù)中定義類成員帶來的缺點(diǎn)。

 使用prototype對(duì)象定義類成員

  上一節(jié)介紹了類的實(shí)現(xiàn)機(jī)制以及構(gòu)造函數(shù)的實(shí)現(xiàn),現(xiàn)在介紹另一種為類添加成員的機(jī)制:prototype對(duì)象。當(dāng)new一個(gè)function時(shí),該對(duì)象的成員將自動(dòng)賦給所創(chuàng)建的對(duì)象,例如:

 

<script language="JavaScript" type="text/javascript">
<!--
 //定義一個(gè)只有一個(gè)屬性prop的類
 function class1(){
  this.prop=1;
 }
 //使用函數(shù)的prototype屬性給類定義新成員
 class1.prototype.showProp=function(){
  alert(this.prop);
 }
 //創(chuàng)建class1的一個(gè)實(shí)例
 var obj1=new class1();
 //調(diào)用通過prototype原型對(duì)象定義的showProp方法
 obj1.showProp();
//-->
</script>

  prototype是一個(gè)JavaScript對(duì)象,可以為prototype對(duì)象添加、修改、刪除方法和屬性。從而為一個(gè)類添加成員定義。

  了解了函數(shù)的prototype對(duì)象,現(xiàn)在再來看new的執(zhí)行過程。

 �。�1)創(chuàng)建一個(gè)新的對(duì)象,并讓this指針指向它;

 �。�2)將函數(shù)的prototype對(duì)象的所有成員都賦給這個(gè)新對(duì)象;

 �。�3)執(zhí)行函數(shù)體,對(duì)這個(gè)對(duì)象進(jìn)行初始化操作;

 �。�4)返回(1)中創(chuàng)建的對(duì)象。

  和上一節(jié)介紹的new的執(zhí)行過程相比,多了用prototype來初始化對(duì)象的過程,這也和prototype的字面意思相符,它是所對(duì)應(yīng)類的實(shí)例的原型。這個(gè)初始化過程發(fā)生在函數(shù)體(構(gòu)造器)執(zhí)行之前,所以可以在函數(shù)體內(nèi)部調(diào)用prototype中定義的屬性和方法,例如:

<script language="JavaScript" type="text/javascript">
<!--
//定義一個(gè)只有一個(gè)屬性prop的類
function class1(){
 this.prop=1;
 this.showProp();
}
//使用函數(shù)的prototype屬性給類定義新成員
class1.prototype.showProp=function(){
 alert(this.prop);
}
//創(chuàng)建class1的一個(gè)實(shí)例
var obj1=new class1();
//-->
</script>

  和上一段代碼相比,這里在class1的內(nèi)部調(diào)用了prototype中定義的方法showProp,從而在對(duì)象的構(gòu)造過程中就彈出了對(duì)話框,顯示prop屬性的值為1。

  需要注意,原型對(duì)象的定義必須在創(chuàng)建類實(shí)例的語句之前,否則它將不會(huì)起作用,例如:

<script language="JavaScript" type="text/javascript">
<!--
//定義一個(gè)只有一個(gè)屬性prop的類
function class1(){
 this.prop=1;
 this.showProp();
}
//創(chuàng)建class1的一個(gè)實(shí)例
var obj1=new class1();
//在創(chuàng)建實(shí)例的語句之后使用函數(shù)的prototype屬性給類定義新成員,只會(huì)對(duì)后面創(chuàng)建的對(duì)象有效
class1.prototype.showProp=function(){
 alert(this.prop);
}
//-->
</script>

  這段代碼將會(huì)產(chǎn)生運(yùn)行時(shí)錯(cuò)誤,顯示對(duì)象沒有showProp方法,就是因?yàn)樵摲椒ǖ亩x是在實(shí)例化一個(gè)類的語句之后。

  由此可見,prototype對(duì)象專用于設(shè)計(jì)類的成員,它是和一個(gè)類緊密相關(guān)的,除此之外,prototype還有一個(gè)重要的屬性:constructor,表示對(duì)該構(gòu)造函數(shù)的引用,例如:

function class1(){
 alert(1);
}
class1.prototype.constructor(); //調(diào)用類的構(gòu)造函數(shù)

  這段代碼運(yùn)行后將會(huì)出現(xiàn)對(duì)話框,在上面顯示文字“1”,從而可以看出一個(gè)prototype是和一個(gè)類的定義緊密相關(guān)的。實(shí)際上:class1.prototype.constructor===class1。

 一種JavaScript類的設(shè)計(jì)模式

  前面已經(jīng)介紹了如何定義一個(gè)類,如何初始化一個(gè)類的實(shí)例,且類可以在function定義的函數(shù)體中添加成員,又可以用prototype定義類的成員,編程的代碼顯得混亂。如何以一種清晰的方式來定義類呢?下面給出了一種類的實(shí)現(xiàn)模式。

  在JavaScript中,由于對(duì)象靈活的性質(zhì),在構(gòu)造函數(shù)中也可以為類添加成員,在增加靈活性的同時(shí),也增加了代碼的復(fù)雜度。為了提高代碼的可讀性和開發(fā)效率,可以采用這種定義成員的方式,而使用prototype對(duì)象來替代,這樣function的定義就是類的構(gòu)造函數(shù),符合傳統(tǒng)意義類的實(shí)現(xiàn):類名和構(gòu)造函數(shù)名是相同的。例如:

 

function class1(){
 //構(gòu)造函數(shù)
}
//成員定義
class1.prototype.someProperty="sample";
class1.prototype.someMethod=function(){
 //方法實(shí)現(xiàn)代碼
}

  雖然上面的代碼對(duì)于類的定義已經(jīng)清晰了很多,但每定義一個(gè)屬性或方法,都需要使用一次class1.prototype,不僅代碼體積變大,而且易讀性還不夠。為了進(jìn)一步改進(jìn),可以使用無類型對(duì)象的構(gòu)造方法來指定prototype對(duì)象,從而實(shí)現(xiàn)類的成員定義:

//定義一個(gè)類class1
function class1(){
 //構(gòu)造函數(shù)
}
//通過指定prototype對(duì)象來實(shí)現(xiàn)類的成員定義
class1.prototype={
 someProperty:"sample", someMethod:function(){
  //方法代碼
 },
 …//其他屬性和方法.
}

  上面的代碼用一種很清晰的方式定義了class1,構(gòu)造函數(shù)直接用類名來實(shí)現(xiàn),而成員使用無類型對(duì)象來定義,以列表的方式實(shí)現(xiàn)了所有屬性和方法,并且可以在定義的同時(shí)初始化屬性的值。這也更象傳統(tǒng)意義面向?qū)ο笳Z言中類的實(shí)現(xiàn)。只是構(gòu)造函數(shù)和類的成員定義被分為了兩個(gè)部分,這可看成JavaScript中定義類的一種固定模式,這樣在使用時(shí)會(huì)更加容易理解。

  注意:在一個(gè)類的成員之間互相引用,必須通過this指針來進(jìn)行,例如在上面例子中的someMethod方法中,如果要使用屬性someProperty,必須通過this.someProperty的形式,因?yàn)樵贘avaScript中每個(gè)屬性和方法都是獨(dú)立的,它們通過this指針聯(lián)系在一個(gè)對(duì)象上。

分享:淺析AJAX中JavaScript類的三種成員
實(shí)現(xiàn)類的公有成員 前面定義的任何類成員都屬于公有成員的范疇,該類的任何實(shí)例都對(duì)外公開這些屬性和方法。 實(shí)現(xiàn)類的私有成員 私有成員即在類的內(nèi)部實(shí)現(xiàn)中可以共享的成員,不對(duì)外公開。JavaScript中并沒有特殊的機(jī)制來定義私有成員,但可以用一些技巧來實(shí)現(xiàn)這

來源:模板無憂//所屬分類:AJAX教程/更新時(shí)間:2010-03-15
相關(guān)AJAX教程