Javascript玩轉(zhuǎn)繼承(一)
Javascript究竟是一門面向?qū)ο蟮恼Z言,還是一門支持對象的語言,我想每個(gè)人都有著自己的看法。那些Javascript忠實(shí)的Fans一定講Javascript是一門面向?qū)ο蟮恼Z言,像《Javascript王者歸來》一書中對Javascript的說法是基于原型的面向?qū)ο?。我談?wù)勎覀€(gè)人的看法。面向?qū)ο蟮娜齻€(gè)特征,繼承,多態(tài),封裝,Javascript雖然實(shí)現(xiàn)起來不像Java,C#等面向?qū)ο蟮恼Z言來得快,但是畢竟也有著一定的支持。因此說Javascript是面向?qū)ο蟮恼Z言是有著一定道理的,但是從繼承這個(gè)部分來談,一系列的繼承法,但是每個(gè)繼承法都無法實(shí)現(xiàn)真正面向?qū)ο笳Z言的威力,因此,說他面向?qū)ο笥兄欢ǖ臓繌?qiáng)。綜上,我對Javascript的理解,更愿意把它叫做一種簡化的面向?qū)ο?,或者說"偽"面向?qū)ο螅ㄟ@個(gè)偽字絕無貶義)。
今天就從面向?qū)ο筮@個(gè)第一個(gè)特征:繼承來談。
什么是繼承?這個(gè)我不想廢話,有一只動(dòng)物,有一個(gè)人,有一個(gè)女孩,這個(gè)就是一個(gè)最簡單,也是典型的繼承鏈。
在C#等面向?qū)ο笾?,很容易?
class Animal
{ }
class People:Animal
{ }
class Girl:People
{ }
那么在Javascript中,沒有類,沒有繼承的提供實(shí)現(xiàn),我們該怎么做呢?
對象偽裝(構(gòu)造繼承法)
什么是對象偽裝呢?我們可能叫做構(gòu)造繼承更容易理解一些。顧名思義,就是用構(gòu)造函數(shù)來玩繼承。其實(shí)就是說把父類的構(gòu)造函數(shù)當(dāng)成是一個(gè)普通的方法,放到子類的構(gòu)造函數(shù)中去執(zhí)行,這樣的話,當(dāng)構(gòu)造對象的時(shí)候,子類的對象當(dāng)然就可以構(gòu)造父類的方法啦!
還是用上面的那個(gè)例子,代碼如下:
function Animal()
{
this.Run=function(){alert("I can run");};
}
function People(name)
{
//在這里就是傳入了父類的構(gòu)造方法,然后執(zhí)行父類的構(gòu)造方法,這個(gè)時(shí)候就//可以使用父類中的方法了。
this.father=Animal;
this.father();
//記得要?jiǎng)h除,否則在子類添加于父類相同名稱的方法時(shí),會(huì)修改到父類。
delete this.Father;
this.name=name;
this.Say=function(){alert("My name is "+this.name);}
}
function Girl(name,age)
{
this.father=People;
this.father(name);
delete this.father;
this.age=age;
this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};
}
這樣的話就實(shí)現(xiàn)了一個(gè)繼承鏈,測試下:
var a=new Animal();
a.Run();
var p=new People("Windking");
p.Run();
p.Say();
var g=new Girl("Xuan",22);
g.Run();
g.Say();
g.Introduce();
結(jié)果如下:
a.
b.
c.
d.
e.
f.
測試成功!
我們來總結(jié)一下這段代碼的關(guān)鍵,指定父類,聲明父類對象,然后刪除臨時(shí)變量,您是否覺得有些麻煩呢?至少我是這么覺得的,一旦忘記了delete,還要承擔(dān)父類被修改的風(fēng)險(xiǎn),針對這個(gè),我們對這個(gè)用call和apply來改進(jìn)!
接著看代碼,還是上面的例子(為了更加容易大家理解,需求改變一下,Animal有了名字):
function Animal(name)
{
this.Run=function(){alert("I can Run");};
}
function People(name)
{
//使用call方法實(shí)現(xiàn)繼承
this.father=Animal;
this.father.call(this,name);
this.name=name;
this.SayName=function(){alert("My name is "+this.name;);};
}
function Girl(name,age)
{
//使用apply方法來實(shí)現(xiàn)繼承
this.father=People;
this.father.apply(this,new Array(name));
this.age=age;
this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};
}
用一樣的測試代碼,發(fā)現(xiàn)測試一樣成功。
如果是新手,可能看后面的這兩段代碼有些暈暈乎乎,什么是call,什么是apply呢?好,在玩轉(zhuǎn)繼承這個(gè)專題中,我加入一個(gè)增刊系列,如果對這個(gè)有不了解,可以看我的這個(gè)文章:《玩轉(zhuǎn)方法:call和apply 》。
對象偽裝,這只是一種實(shí)現(xiàn)繼承的方式,在接下來的文章,我會(huì)繼續(xù)寫出其他的繼承方式以及幾種繼承方式的優(yōu)劣,歡迎繼續(xù)關(guān)注。
相關(guān)文章
js實(shí)現(xiàn)倒計(jì)時(shí)及時(shí)間對象
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)倒計(jì)時(shí)效果及時(shí)間對象,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-11-11
探索export導(dǎo)出一個(gè)字面量會(huì)報(bào)錯(cuò)export?default不會(huì)報(bào)錯(cuò)
這篇文章主要為大家介紹了export導(dǎo)出一個(gè)字面量會(huì)報(bào)錯(cuò)而export?default不會(huì)報(bào)錯(cuò)的問題探索解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2024-01-01
基于JavaScript實(shí)現(xiàn)添加到購物車效果附源碼下載
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)添加到購物車效果附源碼下載的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-08-08
SyntaxHighlighter自動(dòng)識(shí)別并加載腳本語言
SyntaxHighlighter是一個(gè)使用JavaScript編寫的支持多種編程語言語法高亮的JS插件,很多大型網(wǎng)站或博客都在使用?,F(xiàn)在給大家介紹一下如何讓它自動(dòng)識(shí)別加載我們添加的代碼語言2017-02-02
帶領(lǐng)大家學(xué)習(xí)javascript基礎(chǔ)篇(一)之基本概念
這篇文章主要介紹了帶領(lǐng)大家學(xué)習(xí)javascript基礎(chǔ)篇(一)之基本概念的相關(guān)資料,需要的朋友可以參考下2015-11-11
javascript二維數(shù)組轉(zhuǎn)置實(shí)例
這篇文章主要介紹了javascript二維數(shù)組轉(zhuǎn)置方法,實(shí)例分析了數(shù)組行列交換的轉(zhuǎn)置技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
用XMLDOM和ADODB.Stream實(shí)現(xiàn)base64編碼解碼實(shí)現(xiàn)代碼
用 XMLDOM 和 ADODB.Stream 實(shí)現(xiàn)base64編碼解碼實(shí)現(xiàn)代碼,需要的朋友可以參考下。2010-11-11

