Javascript 面向?qū)ο?繼承
更新時(shí)間:2010年05月13日 16:51:07 作者:
所有面向?qū)ο蟮恼Z言都應(yīng)該有繼承的特性,JavaScript 也不例外。
在JavaScript中實(shí)現(xiàn)繼承可以有多種方法,下面說兩種常見的。
一,call 繼承,先看代碼:
先定義一個(gè)“人”類
//人類
Person=function(){
this.name="草泥馬";
this.eat=function(){
alert("我要吃飯");
}
this.sleep=function(){
alert("我要睡覺");
}
}
再定義一個(gè)學(xué)生類,讓它繼承于Person
//學(xué)生類
Student=function(){
Person.call(this);//繼承Person類
this.doHomework=function(){
alert("老師來了,作業(yè)借我抄下");
}
}
關(guān)鍵看 Person.call(this)這句,其中this代表當(dāng)前對(duì)象,即Student ,這很容易理解,而Person.call(this)的意思是:將Person類的所有的公開成員“附加”給Student類,讓Student也具有了Person的所有功能。
和高級(jí)語言一樣,如果子類中出現(xiàn)了和父類中同名的成員,則會(huì)將其覆蓋,也就是所謂的“重寫”了。
同樣的,我們?cè)俣x一個(gè)女孩類 :
//女孩類
Girl=function(){
Person.call(this);//繼承Person類
this.sex="女";
}
JavaScript是可以實(shí)現(xiàn)多重繼承的,請(qǐng)看下面的Master(碩士)類,這個(gè)Master 自然是個(gè)學(xué)生,但同時(shí)又是個(gè)漂亮MM,于是有了下面的代碼:
//碩士類
Master=function(){
Student.call(this);//繼承Student類
Girl.call(this);//繼承Girl類
this.degree="碩士";//學(xué)歷
}
我們可以測(cè)試一下:
var master=new Master();
master.name="鳳姐";
master.eat();
master.doHomework();
alert("偶是名字叫:"+master.name);
alert("偶的性別是:"+master.sex);
多重繼承時(shí)要注意順序,如果兩個(gè)類中有相同名稱的成員,那么后一個(gè)將覆蓋前一個(gè),也就是說當(dāng)前類只會(huì)繼承后一個(gè)類中的成員。
call 方法繼承就說到這,如果大家對(duì)call方法不清楚,就請(qǐng)去問問谷歌兄,我就不贅述了,網(wǎng)上轉(zhuǎn)載得不要太多。下面說下另外一種繼承方式。
二,prototype 原型繼承:
我們?cè)俣x一個(gè)班長類:
//班長類
SquadLeader=function (){
//打招呼
this.hi=function(){
alert("同學(xué)們好,我現(xiàn)在是班長了");
}
}
上面定義了一個(gè)碩士類,現(xiàn)在這個(gè)碩士被提升為班長了,所以這個(gè)Master要繼承SquadLeader了,這次我們用prototype 來實(shí)現(xiàn),請(qǐng)看下面代碼:
Master.prototype=new SquadLeader();//prototype 屬性指向一個(gè)對(duì)象
//或者
//Master.prototype=SquadLeader.prototype;
這樣Master就繼承了SquadLeader類,就這么一句話,這里有兩種形式,其實(shí)原理是一樣的。意思是:將SquadLeader的“靈魂”拷貝給了Master,于是從此SquadLeader能做的事,Master都可以做了。
測(cè)試一下:
var master=new Master();
master.hi()//輸出“同學(xué)們好,我現(xiàn)在是班長了”
我個(gè)人比較喜歡用第一種方案(call 繼承)來實(shí)現(xiàn)繼承,所有代碼都包在一個(gè)“{}”內(nèi),一目了然,在書寫風(fēng)格上較之于第二種更接近于C#。prototype 屬性我一般用來對(duì)已有的類做擴(kuò)展。
JavaScript是門非常靈活的語言,實(shí)現(xiàn)繼承可能還有其他更好的方式,大家可以去研究挖掘,我在這就當(dāng)是拋了塊磚頭, 希望能引出華美的玉石!
一,call 繼承,先看代碼:
先定義一個(gè)“人”類
復(fù)制代碼 代碼如下:
//人類
Person=function(){
this.name="草泥馬";
this.eat=function(){
alert("我要吃飯");
}
this.sleep=function(){
alert("我要睡覺");
}
}
再定義一個(gè)學(xué)生類,讓它繼承于Person
復(fù)制代碼 代碼如下:
//學(xué)生類
Student=function(){
Person.call(this);//繼承Person類
this.doHomework=function(){
alert("老師來了,作業(yè)借我抄下");
}
}
關(guān)鍵看 Person.call(this)這句,其中this代表當(dāng)前對(duì)象,即Student ,這很容易理解,而Person.call(this)的意思是:將Person類的所有的公開成員“附加”給Student類,讓Student也具有了Person的所有功能。
和高級(jí)語言一樣,如果子類中出現(xiàn)了和父類中同名的成員,則會(huì)將其覆蓋,也就是所謂的“重寫”了。
同樣的,我們?cè)俣x一個(gè)女孩類 :
復(fù)制代碼 代碼如下:
//女孩類
Girl=function(){
Person.call(this);//繼承Person類
this.sex="女";
}
JavaScript是可以實(shí)現(xiàn)多重繼承的,請(qǐng)看下面的Master(碩士)類,這個(gè)Master 自然是個(gè)學(xué)生,但同時(shí)又是個(gè)漂亮MM,于是有了下面的代碼:
//碩士類
Master=function(){
Student.call(this);//繼承Student類
Girl.call(this);//繼承Girl類
this.degree="碩士";//學(xué)歷
}
我們可以測(cè)試一下:
復(fù)制代碼 代碼如下:
var master=new Master();
master.name="鳳姐";
master.eat();
master.doHomework();
alert("偶是名字叫:"+master.name);
alert("偶的性別是:"+master.sex);
多重繼承時(shí)要注意順序,如果兩個(gè)類中有相同名稱的成員,那么后一個(gè)將覆蓋前一個(gè),也就是說當(dāng)前類只會(huì)繼承后一個(gè)類中的成員。
call 方法繼承就說到這,如果大家對(duì)call方法不清楚,就請(qǐng)去問問谷歌兄,我就不贅述了,網(wǎng)上轉(zhuǎn)載得不要太多。下面說下另外一種繼承方式。
二,prototype 原型繼承:
我們?cè)俣x一個(gè)班長類:
復(fù)制代碼 代碼如下:
//班長類
SquadLeader=function (){
//打招呼
this.hi=function(){
alert("同學(xué)們好,我現(xiàn)在是班長了");
}
}
上面定義了一個(gè)碩士類,現(xiàn)在這個(gè)碩士被提升為班長了,所以這個(gè)Master要繼承SquadLeader了,這次我們用prototype 來實(shí)現(xiàn),請(qǐng)看下面代碼:
Master.prototype=new SquadLeader();//prototype 屬性指向一個(gè)對(duì)象
//或者
//Master.prototype=SquadLeader.prototype;
這樣Master就繼承了SquadLeader類,就這么一句話,這里有兩種形式,其實(shí)原理是一樣的。意思是:將SquadLeader的“靈魂”拷貝給了Master,于是從此SquadLeader能做的事,Master都可以做了。
測(cè)試一下:
var master=new Master();
master.hi()//輸出“同學(xué)們好,我現(xiàn)在是班長了”
我個(gè)人比較喜歡用第一種方案(call 繼承)來實(shí)現(xiàn)繼承,所有代碼都包在一個(gè)“{}”內(nèi),一目了然,在書寫風(fēng)格上較之于第二種更接近于C#。prototype 屬性我一般用來對(duì)已有的類做擴(kuò)展。
JavaScript是門非常靈活的語言,實(shí)現(xiàn)繼承可能還有其他更好的方式,大家可以去研究挖掘,我在這就當(dāng)是拋了塊磚頭, 希望能引出華美的玉石!
相關(guān)文章
JavaScript isPrototypeOf和hasOwnProperty使用區(qū)別
JavaScript isPrototypeOf和hasOwnProperty的使用技巧,需要的朋友的朋友可以參考下。2010-03-03javascript 面向?qū)ο缶幊袒A(chǔ):封裝
“在面向?qū)ο蟮乃枷胫校詈诵牡母拍钪痪褪穷?。一個(gè)類表示了具有相似性質(zhì)的一類事物的抽象,通過實(shí)例化一個(gè)類,可以獲得屬于該類的一個(gè)實(shí)例(即對(duì)象)”。2009-08-08JavaScript 創(chuàng)建對(duì)象和構(gòu)造類實(shí)現(xiàn)代碼
JavaScript學(xué)習(xí)筆記:創(chuàng)建對(duì)象和構(gòu)造類.2009-07-07不錯(cuò)的JavaScript面向?qū)ο蟮暮唵稳腴T介紹
JavaScript是一門OOP,而有些人說,JavaScript是基于對(duì)象的。2008-07-07javascript 面向?qū)ο缶幊?function也是類
function在javascript中用來創(chuàng)建函數(shù)或方法,但要想實(shí)現(xiàn)面向?qū)ο蠓绞降木幊?,類是不可或缺的角色之一,而且是主角?/div> 2009-09-09XRegExp 0.2: Now With Named Capture
XRegExp 0.2: Now With Named Capture...2007-11-11JavaScript 面向?qū)ο缶幊蹋?) 基礎(chǔ)
自從有了Ajax這個(gè)概念,JavaScript作為Ajax的利器,其作用一路飆升。JavaScript最基本的使用,以及語法、瀏覽器對(duì)象等等東東在這里就不累贅了。把主要篇幅放在如何實(shí)現(xiàn)JavaScript的面向?qū)ο缶幊谭矫妗?/div> 2010-05-05最新評(píng)論
大家感興趣的內(nèi)容
- 1JavaScript 三種創(chuàng)建對(duì)象的方法
- 2JS 創(chuàng)建對(duì)象(常見的幾種方法)
- 3JS類的封裝及實(shí)現(xiàn)代碼
- 4詳解new function(){}和function(){
- 5javascript復(fù)制對(duì)象使用說明
- 6js創(chuàng)建對(duì)象的幾種常用方式小結(jié)(推薦)
- 7Javascript 面向?qū)ο螅ㄒ唬?共有方法,私有方法,特
- 8改變javascript函數(shù)內(nèi)部this指針指向的三種方法
- 9Javascript Object.extend
- 10JavaScript定義類或函數(shù)的幾種方式小結(jié)