第原生Javascript實(shí)現(xiàn)繼承方式及其優(yōu)缺點(diǎn)詳解目錄前言原型繼承優(yōu)點(diǎn)構(gòu)造函數(shù)繼承

優(yōu)點(diǎn)

缺點(diǎn)

組合式繼承

寄生式組合繼承總結(jié)

前言

最近在復(fù)習(xí)javascript的一些基礎(chǔ)知識，為開啟新的征程做準(zhǔn)備。所以開始記錄一些自己學(xué)習(xí)的內(nèi)容。

那今天的主題是js的原生繼承方式

廢話少說，上代碼！

首先是我們的父類代碼。

在這里我們創(chuàng)建一個(gè)Person的類作為父類，它的構(gòu)造函數(shù)需要2個(gè)參數(shù)name和age。

然后我們在它的原型上添加一個(gè)sayHi的方法。

functionPerson(name,age){

=name||'noname';

this.age=age||0;

Ptotype.sayHi=function(){

console.log('Hi,I\'m'++'andi'm'+this.age+'yearsold!');

varp=newPerson('A',20);

p.sayHi();//Hi,I'mAandi'm20yearsold!

原型繼承

//原型繼承

functionTeacher(){

Ttotype=newPerson('B',22);

Ttotype.constructor=Teacher;

vart=newTeacher();

t.sayHi();//Hi,I'mBandi'm22yearsold!

console.log(tinstanceofPerson);//true

console.log(tinstanceofTeacher);//true

優(yōu)點(diǎn)

從上面的代碼來看，Teacher的實(shí)例擁有了Person的屬性和方法。并且實(shí)例對象既是Person的實(shí)例也是Teacher的實(shí)例。而且這種繼承方式特別的簡單。

缺點(diǎn)

我們可以很容易的就發(fā)現(xiàn)Teacher類的name和age是固定的，都是name=B和age=22，換句話說就是我們無法實(shí)現(xiàn)按照我們的意愿給父類的構(gòu)造函數(shù)傳參。并且一個(gè)我們不能給一個(gè)Teacher指定多個(gè)原型，也就是沒法多繼承。然后我們看下下面這段代碼：

vart1=newTeacher();

vart2=newTeacher();

T="C";

t1.sayHi();//Hi,I'mCandi'm22yearsold!

t2.sayHi();//Hi,I'mCandi'm22yearsold!

上面這段代碼中我們可以看到當(dāng)原型中的屬性或者方法被改變時(shí)，所有的子類實(shí)例的屬性和方法也會跟著被改變，也就是原型繼承的另一個(gè)缺點(diǎn)：所有子類共享同一個(gè)原型對象

這里說到了原型,我很早之前也寫過一個(gè)關(guān)于原型的隨筆，