實現原理:
讓父類的例項作為子類的原型物件
如果單獨只使用原型鏈繼承會存在以下兩個問題:
1)包含引用型別值的原型屬性會被所有例項所共享:基本資料型別不受影響
2)無法在不影響其他例項的情況下向父類傳遞引數:不能實現子類向父類傳參
//父類:建構函式
function
parent
(name)
parent.prototype =
}//子類
function
child()
//注意:修改子類c1引用資料型別color的值,例項物件c2也被修改了
c1.color.
push
("yellow");
console.
log(c1.color)
;console.
log(c2.color)
;
關鍵一步:讓父類的例項作為子類的原型物件,問題一
//將父類的例項作為子類的原型物件
//這種方式沒有辦法做到給每個子類的例項單獨設定各自的屬性即問題一
child.prototype =
newparent
("tom"
);
例項宣告兩個物件:
//宣告乙個子類的例項 c1
var c1 =
newchild()
;//宣告乙個子類的例項 c2
var c2 =
newchild()
;console.
log(c1.name)
;console.
log(c1.color)
;console.
log(c2.name)
;console.
log(c2.color)
;
控制台的輸出:
修改建構函式的的數值為基本資料型別時,例項之間不互相影響
//修改子類c1基本資料型別name的值,c2不受影響
c1.name =
"jack"
;console.
log(c1.name)
;console.
log(c2.name)
;
控制台輸出:
問題二:修改建構函式的數值為引用型別資料時,例項物件之間共享,資料相互影響
//注意:修改子類c1引用資料型別color的值,例項物件c2也被修改了
c1.color.
push
("yellow");
console.
log(c1.color)
;console.
log(c2.color)
;
控制台輸出:
原型鏈解構:
每個物件都是由建構函式建立出來的,因為每個物件都有建構函式
每個建構函式都有乙個與之對應的原型物件
原型物件本身也是物件
因此,原型物件也有自己的建構函式
原型物件的建構函式也有自己的原型物件
原型物件的建構函式的原型物件也是物件,所以它也有自己的建構函式
原型物件的建構函式的原型物件的建構函式也有自己的原型物件…
以上,形成乙個鏈式結構,就稱為原型鏈
原型鏈的頂端時 object.prototype , object.prototype 本身也是乙個物件,因此也有原型物件.
object.prototype.proto 是 null
原型鏈中物件屬性的搜尋規則—就近原則
物件屬性的方法去訪問屬性的時候,先查詢有沒有物件的例項屬性,如果有那麼就之直接使用
如果沒有,那麼就去物件的原型物件上去找,如果有那麼就直接使用
如果沒有,那麼就接著查詢原型物件的原型物件,如果有,那麼就直接使用
如果沒有,那麼就繼續上面的搜尋過程
直到搜尋到 object.prototype 為止,如果還是沒有找到就返回 undefined 或者報錯
注意:原型鏈搜尋的路徑越長,查詢屬性所花費的時間就越多
原型鏈繼承的步驟:
提供乙個父建構函式
提供乙個子建構函式
設定子建構函式的原型物件為父建構函式的乙個例項物件
在例項物件上面設定屬性和方法
原型鏈使用時的注意事項
在設定完原型鏈之後需要修正構造器屬性的指向
要在設定完原型繼承之後再來為原型物件新增屬性和方法
要在設定完原型繼承之後只能通過物件的動態特性來設定原型物件的屬性和方法,不要使用字面量的方式
原型鏈繼承的問題:
引數傳遞問題:無法對父類建構函式傳遞引數
原型共享問題:繼承過來的例項屬性會成為當前物件的原型屬性,會被建立出來的多個物件所共享
要在設定完原型繼承之後只能通過物件的動態特性來設定原型物件的屬性和方法,不要使用字面量的方式
原型鏈繼承的問題:
引數傳遞問題:無法對父類建構函式傳遞引數
原型共享問題:繼承過來的例項屬性會成為當前物件的原型屬性,會被建立出來的多個物件所共享
原型鏈繼承例項
先用物件字面量去構造乙個有用的物件 function says function 一旦有了乙個想要的物件,我們就可以利用object.create方法構造出更多的例項來 var mycat object.create mymammal mycat.name yzs mycat.saying meow...
原型 原型鏈 繼承
原型 是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...