原生繼承的三種方式

1.原型鏈繼承:

functionBook (name,author){

this.name=name;

this.author=author;

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){}

JavaScript.prototype=newBook("JavaScript","Nicholas");

varjs1=newJavaScript();

varjs2=newJavaScript();

js1.tell();

js2.tell();

可以發(fā)現(xiàn),原型鏈繼承有一個問題然遏,那就是父類中的私有屬性播玖,會因為父類作為子類原型構(gòu)建原型鏈颜曾,使得子類所有實例所共享往枷。當(dāng)我們通過一個實例修改共享屬性時更耻,其他實例也將受到影響:

functionBook (name,author){

this.name=name;

this.author=[author];

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){}

JavaScript.prototype=newBook("JavaScript","Nicholas");

varjs1=newJavaScript();

varjs2=newJavaScript();

js1.author.push("C.Zakas");

js2.tell();

但是當(dāng)你直接為實例中屬性賦值時自沧,是在實例中重新定義了一個對應(yīng)屬性纵柿,而不是在修改原型中屬性:

functionBook (name,author){

this.name=name;

this.author=author;

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){}

JavaScript.prototype=newBook("JavaScript","Nicholas");

varjs1=newJavaScript();

varjs2=newJavaScript();

js1.author="C.Zakas";

//并不是js1沒有影響js2,而是在js1中創(chuàng)建了新author屬性

console.log(js1.hasOwnProperty("author"));//true

console.log(js2.hasOwnProperty("author"));//false

js1.tell();//Book:JavaScript?Author:C.Zakas

js2.tell()

2.構(gòu)造函數(shù)繼承:

functionBook?(name,author){

this.name=name;

this.author=author;

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){

Book.apply(this,arguments);

}

varjs1=newJavaScript("JavaScript","Nicholas");

varjs2=newJavaScript("JavaScriopt","C.Zakas");

console.log("js1:"+js1.author+"?js2:"+js2.author);//js1:Nicholas?js2:C.Zakas

js1.tell();//Uncaught?TypeError:?js1.tell?is?not?a?function

js2.tell();//Uncaught?TypeError:?js2.tell?is?not?a?function

構(gòu)造函數(shù)繼承衩茸,可以使每個子類實例有一份自己的屬性芹血,但是無法找到父類原型中的函數(shù)。

3.組合繼承:

functionBook (name,author){

this.name=name;

this.author=author;

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){

Book.apply(this,arguments);

}

JavaScript.prototype=newBook();

varjs1=newJavaScript("JavaScript","Nicholas");

varjs2=newJavaScript("JavaScriopt","C.Zakas");

console.log("js1:"+js1.author+"?js2:"+js2.author);//js1:Nicholas?js2:C.Zakas

js1.tell();//Book:JavaScript?Author:Nicholas

js2.tell();

組合繼承使得每個子類實例楞慈,既可以保存一份自己的屬性幔烛,又可以共享同一個函數(shù)。

4.寄生組合繼承:

functionBook (name,author){

this.name=name;

this.author=author;

}

Book.prototype.tell=function(){console.log("Book:"+this.name+"?Author:"+this.author);};

functionJavaScript(){

Book.apply(this,arguments);

}

JavaScript.prototype=Object.create(Book.prototype);

JavaScript.prototype.constructor=JavaScript;

varjs1=newJavaScript("JavaScript","Nicholas");

varjs2=newJavaScript("JavaScriopt","C.Zakas");

console.log("js1:"+js1.author+"?js2:"+js2.author);//js1:Nicholas?js2:C.Zakas

js1.tell()囊蓝;

js2.tell();

console.log(js1.tell===js2.tell);

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末饿悬,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子聚霜,更是在濱河造成了極大的恐慌狡恬,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,198評論 6 514
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件蝎宇,死亡現(xiàn)場離奇詭異弟劲,居然都是意外死亡,警方通過查閱死者的電腦和手機姥芥,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,334評論 3 398
  • 文/潘曉璐 我一進店門兔乞,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人凉唐,你說我怎么就攤上這事庸追。” “怎么了台囱?”我有些...
    開封第一講書人閱讀 167,643評論 0 360
  • 文/不壞的土叔 我叫張陵淡溯,是天一觀的道長。 經(jīng)常有香客問我簿训,道長咱娶,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,495評論 1 296
  • 正文 為了忘掉前任强品,我火速辦了婚禮豺总,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘择懂。我一直安慰自己喻喳,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 68,502評論 6 397
  • 文/花漫 我一把揭開白布困曙。 她就那樣靜靜地躺著表伦,像睡著了一般。 火紅的嫁衣襯著肌膚如雪慷丽。 梳的紋絲不亂的頭發(fā)上蹦哼,一...
    開封第一講書人閱讀 52,156評論 1 308
  • 那天,我揣著相機與錄音要糊,去河邊找鬼纲熏。 笑死,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的局劲。 我是一名探鬼主播勺拣,決...
    沈念sama閱讀 40,743評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼鱼填!你這毒婦竟也來了药有?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,659評論 0 276
  • 序言:老撾萬榮一對情侶失蹤苹丸,失蹤者是張志新(化名)和其女友劉穎愤惰,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體赘理,經(jīng)...
    沈念sama閱讀 46,200評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡宦言,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,282評論 3 340
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了商模。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蜡励。...
    茶點故事閱讀 40,424評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖阻桅,靈堂內(nèi)的尸體忽然破棺而出凉倚,到底是詐尸還是另有隱情,我是刑警寧澤嫂沉,帶...
    沈念sama閱讀 36,107評論 5 349
  • 正文 年R本政府宣布稽寒,位于F島的核電站,受9級特大地震影響趟章,放射性物質(zhì)發(fā)生泄漏杏糙。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,789評論 3 333
  • 文/蒙蒙 一蚓土、第九天 我趴在偏房一處隱蔽的房頂上張望宏侍。 院中可真熱鬧,春花似錦蜀漆、人聲如沸谅河。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,264評論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽绷耍。三九已至,卻和暖如春鲜侥,著一層夾襖步出監(jiān)牢的瞬間褂始,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,390評論 1 271
  • 我被黑心中介騙來泰國打工描函, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留崎苗,地道東北人狐粱。 一個月前我還...
    沈念sama閱讀 48,798評論 3 376
  • 正文 我出身青樓,卻偏偏與公主長得像胆数,于是被迫代替她去往敵國和親肌蜻。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,435評論 2 359

推薦閱讀更多精彩內(nèi)容

  • 單例模式 適用場景:可能會在場景中使用到對象幅慌,但只有一個實例宋欺,加載時并不主動創(chuàng)建轰豆,需要時才創(chuàng)建 最常見的單例模式胰伍,...
    Obeing閱讀 2,076評論 1 10
  • (a fork of Airbnb's Javascript Style Guide) Strikingly ES...
    飄零_zyw閱讀 1,164評論 1 2
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn)酸休,斷路器骂租,智...
    卡卡羅2017閱讀 134,693評論 18 139
  • 今天我要給大家介紹一款退燒藥。 這個糖漿是桔色的斑司,有桔子...
    5502史家穎閱讀 1,966評論 3 0
  • 不要哭了嗎 該哭的人是我吧 你都坦白愛上了他 我有什么辦法 我也同意啦 既然你提出想法 我們不要拖拖拉拉 就從明天...
    簡書華閱讀 166評論 0 0