js實現繼承的六種方式

2021-08-09 18:16:38 字數 2838 閱讀 2880

原型鏈

利用原型讓乙個引用型別繼承另外乙個引用型別的屬性和方法。

建構函式,原型,例項之間的關係:每個建構函式都有乙個原型物件,原型物件包含乙個指向建構函式的指標,而例項都包含乙個指向原型物件的內部指標。

原型鏈實現繼承例子:

function supertype()

supertype.prototype.getsupervalue = function()

function subtype()

//繼承了supertype

subtype.prototype = new supertype();

subtype.prototype.getsubvalue = function ()

var instance = new subtype();

console.log(instance.getsupervalue());//true

借用建構函式

function supertype()

function subtype()

var instance1 = new subtype();

instance1.colors.push("black");

console.log(instance1.colors);//"red","blue","green","black"

var instance2 = new subtype();

console.log(instance2.colors);//"red","blue","green"

組合繼承

將原型鏈和借用建構函式的技術組合在一塊,從而發揮兩者之長的一種繼承模式。

function supertype(name)

supertype.prototype.sayname = function()

function subtype(name, age)

//繼承方法

subtype.prototype = new supertype();

subtype.prototype.constructor = subtype;

subtype.prototype.sayage = function()

var instance1 = new subtype("evanchen",18);

instance1.colors.push("black");

consol.log(instance1.colors);//"red","blue","green","black"

instance1.sayname();//"evanchen"

instance1.sayage();//18

var instance2 = new subtype("evanchen666",20);

console.log(instance2.colors);//"red","blue","green"

instance2.sayname();//"evanchen666"

instance2.sayage();//20

原型式繼承
借助原型可以基於已有的物件建立新物件,同時還不必須因此建立自定義的型別.

var person = ;

var person1 = object(person);

person1.name = "greg";

person1.friends.push("rob");

var person2 = object(person);

person2.name = "linda";

person2.friends.push("barbie");

console.log(person.friends);//"shelby","court","van","rob","barbie"

ecmascript5通過object.create()方法規範化了原型式繼承,這個方法接收兩個引數:乙個用作新物件原型的物件和乙個作為新物件定義額外屬性的物件。

var person = ;

var person1 = object.create(person);

person1.name = "greg";

person1.friends.push("rob");

var person2 = object.create(person);

person2.name = "linda";

person2.friends.push("barbie");

console.log(person.friends);//"shelby","court","van","rob","barbie"

寄生式繼承
建立乙個僅用於封裝繼承過程的函式,該函式在內部以某種方式來增強物件,最後再像真正是它做了所有工作一樣返回物件。

function createanother(original) ;

return clone;

}var person = ;

var anotherperson = createanother(person);

anotherperson.sayhi();///"hi"

寄生組合式繼承
通過借用函式來繼承屬性,通過原型鏈的混成形式來繼承方法

function supertype(name)

supertype.prototype.sayname = function ();

function subtype(name,age)

inheritproperty(subtype,supertype);

subtype.prototype.sayage = function()

js 實現繼承的六種方式

原型鏈 利用原型讓乙個引用型別繼承另外乙個引用型別的屬性和方法。建構函式,原型,例項之間的關係 每個建構函式都有乙個原型物件,原型物件包含乙個指向建構函式的指標,而例項都包含乙個指向原型物件的內部指標。原型鏈實現繼承例子 function supertype supertype.prototype....

js實現繼承的六種方式

原型鏈利用原型讓乙個引用型別繼承另外乙個引用型別的屬性和方法。建構函式,原型,例項之間的關係 每個建構函式都有乙個原型物件,原型物件包含乙個指向建構函式的指標,而例項都包含乙個指向原型物件的內部指標。原型鏈實現繼承例子 function supertype supertype.prototype.g...

繼承的六種實現方式

基本思想就是 利用原型讓乙個引用型別繼承另乙個引用型別的屬性和方法 function supertype supertype.prototype.getsupervalue function function subtype 繼承了 supertype subtype.prototype new s...