Javascript 面向對象繼承

2019-11-21 00:30:38

字體：大中小

來源：轉載

供稿：網友

在JavaScript中實現繼承可以有多種方法，下面說兩種常見的。

一，call 繼承，先看代碼：
　　先定義一個“人”類

 
//人類 
Person=function(){ 
this.name="草泥馬"; 
this.eat=function(){ 
alert("我要吃飯"); 
} 
this.sleep=function(){ 
alert("我要睡覺"); 
} 
} 

　　再定義一個學生類，讓它繼承于Person

復制代碼代碼如下:

 
//學生類 
Student=function(){ 
Person.call(this);//繼承Person類 
this.doHomework=function(){ 
alert("老師來了，作業借我抄下"); 
} 
} 

　　關鍵看 Person.call(this)這句,其中this代表當前對象，即Student ，這很容易理解，而Person.call(this)的意思是：將Person類的所有的公開成員“附加”給Student類，讓Student也具有了Person的所有功能。
　　和高級語言一樣，如果子類中出現了和父類中同名的成員，則會將其覆蓋，也就是所謂的“重寫”了。
　　同樣的，我們再定義一個女孩類：

復制代碼代碼如下:

 
//女孩類 
Girl=function(){ 
Person.call(this);//繼承Person類 
this.sex="女"; 
} 
　　JavaScript是可以實現多重繼承的，請看下面的Master(碩士)類，這個Master 自然是個學生，但同時又是個漂亮MM,于是有了下面的代碼： 
//碩士類 
Master=function(){ 
Student.call(this);//繼承Student類 
Girl.call(this);//繼承Girl類 
this.degree="碩士";//學歷 
} 

　　我們可以測試一下：

復制代碼代碼如下:

 
var master=new Master(); 
master.name="鳳姐"; 
master.eat(); 
master.doHomework(); 
alert("偶是名字叫："+master.name); 
alert("偶的性別是："+master.sex); 

　　多重繼承時要注意順序，如果兩個類中有相同名稱的成員，那么后一個將覆蓋前一個，也就是說當前類只會繼承后一個類中的成員。
　　call 方法繼承就說到這，如果大家對call方法不清楚，就請去問問谷歌兄，我就不贅述了,網上轉載得不要太多。下面說下另外一種繼承方式。
　　二，prototype 原型繼承：
　　我們再定義一個班長類：

復制代碼代碼如下:

 
//班長類 
SquadLeader=function (){ 
//打招呼 
this.hi=function(){ 
alert("同學們好，我現在是班長了"); 
} 
} 

　　上面定義了一個碩士類，現在這個碩士被提升為班長了，所以這個Master要繼承SquadLeader了，這次我們用prototype 來實現，請看下面代碼：

Master.prototype=new SquadLeader();//prototype 屬性指向一個對象
//或者
//Master.prototype=SquadLeader.prototype;
　　這樣Master就繼承了SquadLeader類，就這么一句話，這里有兩種形式，其實原理是一樣的。意思是：將SquadLeader的“靈魂”拷貝給了Master，于是從此SquadLeader能做的事，Master都可以做了。
　測試一下：
var master=new Master();
master.hi()//輸出“同學們好，我現在是班長了”　　
　　
　　我個人比較喜歡用第一種方案(call 繼承)來實現繼承，所有代碼都包在一個“{}”內，一目了然，在書寫風格上較之于第二種更接近于C#。prototype 屬性我一般用來對已有的類做擴展。
　　JavaScript是門非常靈活的語言，實現繼承可能還有其他更好的方式，大家可以去研究挖掘，我在這就當是拋了塊磚頭，希望能引出華美的玉石！

上一篇：該如何加載google-analytics(或其他第三方)的JS

下一篇：Javascript 面向對象重載