js基礎 繼承

2022-06-14 12:21:13 字數 2279 閱讀 4159

1、實現繼承:原型鏈

function extend1()

function extend2()

extend2.prototype = new extend1();//extend2繼承了extend1中的屬性

(父型別的例項化物件賦值給子型別的原型屬性,父型別中的建構函式和原型資訊都會給extend2)

var _extend1 = new extend2();

console.log(_extend1.name);//張三

console.log(_extend1.age);//18

function extend3()

extend3.prototype = new extend2();//extend3繼承了extend1和extend2

var _extend2 = new extend3();

console.log(_extend2.name);//張三

console.log(_extend2.age);//18

console.log(_extend2.address);//重慶

extend1.prptotype.name = "lucy";

var _extend1 = new extend1();

console.log(_extend1.name);//張三 

就近原則,現在例項裡面找,有就返回,沒有才去原型裡面找

子型別從屬於自己或他的超型別(父型別)

alert(_extend2.instanceof object);//true 

alert(_extend2.instanceof extend2);//true 

alert(_extend2.instanceof extend1);//true 

2、組合繼承

function group1(age)

建構函式裡的方法放在構造裡每次例項化都會分配乙個記憶體位址(浪費),放在原型裡保證每次例項化都

group1.prototype.run = function ()

function group2(age)

group2.prototype = new group1();//

原型鏈繼承,否則原型裡的run方法是訪問不到的

var _group1 = new group2(20);

console.log(_group1.run());

3、原型式繼承

1. 臨時中轉函式

function obj (o) ;//f建構函式是乙個臨時新建的物件,用於儲存傳過來的物件

f.prototype = o; //jiango物件例項賦值給f建構函式的原型物件

return new f(); //返回這個得到傳遞過來物件的物件例項

}2. 字面量的宣告方式(相當於 var box = new box();)

var box=

f.prototype = 0;//

var box1 = obj(box);box1就等於 new f();

alert(box1.name);//lucy

4、寄生式繼承=原型式+工廠模式

1. 臨時中轉函式

function obj (o) ;//f建構函式是乙個臨時新建的物件,用於儲存傳過來的物件

f.prototype = o; //jiango物件例項賦值給f建構函式的原型物件

return new f(); //返回這個得到傳遞過來物件的物件例項

}//寄生函式

function create(o)

return f;

}var box=

var box1 = create(box);

alert(box1.run());//lucy方法

5、寄生式組合繼承(最終完美版本)

1. 臨時中轉函式

function obj (o) ;//f建構函式是乙個臨時新建的物件,用於儲存傳過來的物件

f.prototype = o; //jiango物件例項賦值給f建構函式的原型物件

return new f(); //返回這個得到傳遞過來物件的物件例項

}2.寄生函式

function create(box,desk)

3.建構函式

function box(name,age)

5.物件冒充

function desk(name,age)

6.通過寄生組合繼承來實現繼承

create(box,desk);//用於替代 desk.prototype = new box();

js基礎 繼承

js 繼承是乙個非常強大的特性之一。首先,我們定義乙個需要實現繼承的父類,定義乙個人的基類 function people name,age people.prototype.hello function 1 原型鏈繼承 function woman woman.prototype new peop...

js繼承和基礎繼承小結

前兩天學習js繼承的時候覺得有點繞,子承父 父承子的一通,後來搜到一篇阮一峰大神的繼承方式的部落格學習了一下,現整理了一下主要的五種繼承方式。父構造器person,子構造器man,man是子構造器new出來的物件,只能繼承父構造器中的屬性 代表繼承屬性和方法.第二種叫原型繼承 由於person物件中...

Js基礎之物件的繼承

二 原型鏈 不了解原型鏈的請先看 一文看懂原型鏈 三 繼承方法 原型鏈繼承即採用定義子建構函式的prototype指向父類的例項的方法 本質是 父公有 父私有 子公有 function parent function child child.prototype new parent 父類的公有和私有...