JS中幾種繼承的方式及缺點

2021-09-21 06:35:14 字數 2562 閱讀 2596

原型鏈繼承

每個建構函式都有乙個原型物件(通過prototype屬性)

原型物件都包含乙個指向建構函式的指標(通過constructor屬性)

例項都包含乙個指向原型物件的內部指標(通過隱式proto屬性)

那麼,若原型物件等於另乙個原型的例項,則此時原型物件將包含乙個指向另乙個原型物件的指標。相應的另乙個原型中也包含乙個指向另乙個建構函式的指標。如此層層遞進,就構成了例項與原型的鏈條。

//父類

function person(name)

}person.prototype.age=10;

//原型鏈繼承

function people()

people.prototype=new person();

var people1=new people();

console.log(people1.age);

console.log(people1 instanceof person);

缺點:

新例項無法向父類建構函式傳參。

繼承單一。

原型上的屬性是共享的,乙個例項修改了原型屬性,另乙個例項的原型屬性也會被修改。

建構函式繼承

建構函式繼承也叫偽造物件或經典繼承,這種方式解決了原型鏈繼承的問題,例項可以獨享乙份引用型別的值 ,通過call改變this指向,這樣每次執行supertype函式,this指向的都是新的物件。相當於每個新的物件都有乙份完整的supertype**。即每個例項都有乙份自己的colors屬性副本。可以通過call函式向supertype傳引數。

//建構函式繼承

function people()

var people1=new people();

console.log(people1.name);

console.log(people1.age);

console.log(people1.instanceof peerson);

缺點:只能繼承父類建構函式的屬性,無法實現建構函式的復用,每個新例項都有父類建構函式的副本,臃腫。

組合繼承

也叫偽經典繼承,它是最常用的的繼承方式,組合繼承將原型鏈繼承和建構函式繼承結合到一起,結合了兩種模式的優點,傳參和復用。

//組合繼承

function people(name)

people.prototype=new person();

var peo=new people('name');

console.log(peo.name);

console.log(peo.age);

缺點:呼叫了兩次父類建構函式(耗記憶體),子類的建構函式會代替原型上的那個父類建構函式。

原型式繼承

借助原型可以基於已有的物件建立新物件,不必因此建立自定義型別。該方法與原型鏈繼承類似,但是寫法比它簡單,若只是想讓乙個物件和另乙個相似,可以使用這種方法。

//原型式繼承

function people(obj)

p.prototype=obj;

return new p();

}var peo=new person();

var peo1=content(peo);

console.log(peo1.age);

缺點:包含引用型別值的屬性始終共享相應的值。無法實現復用。

寄生式繼承

沒有建立自定義型別,因為只是套了個殼子返回物件,這個函式順理成章就成了建立的新物件。

//寄生式繼承

function content(obj)

p.prototype=obj;

return new p();

}var sup=new person();

function subobject(obj)

var sup2=subobject(sup);

console.log(typeof subobject);

console.log(typeof sup2);

console.log(sup2.name);

缺點:這樣做相當於建構函式那樣,並不是真正的函式復用。而且包含引用型別值的屬性依然始終共享相應的值。

寄生組合式繼承

//寄生

function content(obj)

p.prototype=obj;

return new p();

}var con=content(person.prototype);

//組合

function sub()

sub.prototype=con;

con.constructor=sub;

var sub1=new sub();

console.log(sub1.age);

js繼承的幾種方式及優缺點

前言 js作為物件導向的弱型別語言,繼承也是其非常強大的特性之一。那麼如何在js中實現繼承呢?讓我們拭目以待。既然要實現繼承,那麼首先我們得有乙個父類,如下 定義乙個動物類 function animal name 原型方法 animal.prototype.eat function food 核心...

js繼承的幾種方式,以及缺點

1.原型鏈繼承 可以繼承屬性和方法,但是會對原型上的方法誤修改 例如 繼承屬性 父類 function person 子類 function student s student.prototype new person var stu1 new student 1 console.log stu1....

Js繼承方式及優缺點

作為一門基於物件的語言,js中也可以通過繼承來實現父型別和子型別之間屬性或方法的傳遞,其方式有以下幾種 1 原型鏈繼承 子型別的原型物件是父型別的例項即subertype.prototype new supertype 缺點 子型別繼承了父型別原型中的所有屬性和方法,但是對於引用型別的屬性值,所有例...