原型鏈與繼承

2021-08-26 09:42:00 字數 2097 閱讀 6772

一、原型鏈

基本思想:讓乙個引用型別繼承另乙個引用型別的屬性和方法。

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

原型鏈繼承例項:

function supertype(){

this.property=true;

supertype.prototype.getsupervalue=function(){

return this.property;

function subtype(){

this.subproperty=false

subtype.prototype=new supertype();

subtype.prototype.getsubvalue=function(){

return this.subproperty;

var instance=new subtype();

alert(instance.getsupervalue());//true

例項中定義了兩個型別:supertype和subtype,兩者分別定義了乙個屬性和乙個方法。主要過程為:subtype的例項中包含乙個指標指向subtype的原型,而subtype的原型經由supertype的例項指向supertype的原型。總而言之繼承的本質是重寫原型物件,代之以新型別的例項。

注意:1、給原型新增方法的**一定要放在替換原型的語句之後。

2、不能使用物件字面量建立原型方法。

3、由於引用型別值的原型屬性會被所有例項共享,在通過原型實現繼承的時候,原型實際上會變成另外乙個型別的例項,於是原先的例項就順理成章地變成了現在的原型屬性。

4、建立子型別的例項時,不能向超型別的建構函式中傳遞引數。

二、借用建構函式

建構函式繼承例項:

function supertype(){

this.name=name;

function subtype(){

//繼承supertye,同時傳遞引數

supertype.call(this,"zjj");

//例項屬性

this.age=29;

var instance=new subtype();

alert(instance.name);

alert(instance.age);

注意:如果僅僅借用建構函式,方法都在建構函式中定義,無法實現函式復用。

三、組合繼承

基本思想:使用原型鏈實現對原型屬性和方法的繼承,而通過借用建構函式實現對例項屬性的繼承。

組合繼承例項:

function supertype(){

this.name=name;

this.color=["red","blue","green"];

supertype.prototype.sayname=function(){

alert(this.name);

function subtype(name,age){

//繼承supertye,同時傳遞引數

supertype.call(this,name);

//例項屬性

this.age=age;

subtype.prototyepe=new supertype();

subtype.prototype.sayage=function(){

alert(this.age);

var instance1=new subtype("zjj",25);

instance1.push("black");

alert(instance1.color);//"red","blue","green","black"

alert(instance1.sayname);//zjj

alert(instance1.sayage);//25

var instance2=new supertype("zj",22);

alert(instance2.color);//"red","blue","green"

alert(instance2.sayname);//zj

alert(instance2.sayage);//22

原型 原型鏈與繼承

面試中經常考到物件導向的一些知識,在這記錄一下,如有不對歡迎指正,願在前端的道路上共勉!一 原型 1.什麼是原型 簡單說就像css的class一樣,是公用的,給dom元素加個class名就可以公用樣式,那麼原型就相當於css裡面的class,都可以用。在建構函式建立出來的時候,系統會預設的幫建構函式...

原型 原型鏈 繼承

原型 是function物件的乙個屬性,它定義了建構函式 製造出的物件 的公共祖先。通過該建構函式產生的物件,可以繼承該原型的屬性和方法。原型也是物件 這定義有點模糊,用 解釋一下 我們在控制台中列印出了這個,首先son物件的建構函式是foo,但是我們的foo中什麼屬性都沒有,怎麼會出現乙個 pro...

原型 原型鏈 繼承

在 js 中,一切皆物件!下面就讓我們從建立物件開始,逐步學習js中的核心知識 原型,原型鏈,繼承等 1.字面量方式建立物件 var obj var obj1 2.使用 new object 的方式建立物件 var obj2 new object obj2.name 張三 obj2.age 13 o...