首先,要明確,在js中:
1、每個函式物件都有乙個 prototype屬性,我們稱之為原型屬性
2、每個物件都有乙個 __proto__ 屬性,(其實是指向他建構函式的原型) 3
、所有的原型物件都有
constructor
屬性,該屬性對應建立所有指向該原型的例項的建構函式
4、函式物件和原型物件通過
prototype
和constructor
屬性進行相互關聯
.在js中,「萬物皆物件」,函式物件也是物件的一種。
對於新手來說,最難理解的就是prototype 和 __proto__ 之間的關係。
先看區別:(盜個個人覺得還不錯的圖)
看如下demo:
function
person()
varwill
=new
person()
它所對應的的原型圖如下:
原型**析:
1、 我們建立了乙個 函式物件 叫做 person,這個物件有 __proto__ 和 prototype屬性
2、 person.prototype 是該函式的原型物件,該物件有 constructor 屬性指向原函式物件,和__proto__指向 他原函式物件的 「父」 函式的原型物件,即object.protytype.
3、 我們知道js中所有的物件都是繼承自 object,就是圖中 的 function object,該物件為 最頂級函式物件,所有的物件的__proto__屬性最終都指向了該物件的原型物件。即object.prototype
4、 另外所有的函式物件都是繼承自 function的原型,object也是乙個函式物件,所以object.__protu__ === function.prototype. 也是指向了 function的原型
5、 對於function 函式物件,他和所有其他函式物件一樣有個__proto__指向了 function.prototype, 而function的原型中有constructor屬性指向 function物件。即 function.__proto__ === function.prototype. function === function.prototype.constructor
6、 同樣在 頂級物件object 的原型屬性中也有 constructor屬性指向 頂級物件本身。即 object === object.prototype.constructor.
7、 再看persopn函式物件,person有個一 __proto__指向 function的原型,有個prototype屬性指向了 他自己的原型。在person的原型中,有 constructor屬性指向 person,有__proto__屬性指向了object的原型,即 person === person.prototype.constructor。 person.__proto__ === function.prototype
8、 最後看一下通過person建立的will物件。這個物件 有乙個 __proto__屬性指向它建構函式的原型。即will.__proto__ === person.prototype
(ps: 以上說的可能有點囉嗦,但是需要你每一句都精度完之後,就應該能理解物件的原型和原型鏈,以及js中的繼承關係)
vara
=function
(){};
vara =
newa
();
console
.log
(a.__proto__);
//a {}
(即構造器
function a
的原型物件)
console
.log
(a.__proto__.__proto__);
//object {}
(即構造器
function object
的原型物件)
console
.log
(a.__proto__.__proto__.__proto__);
//null
上述**的繼承關係如下圖:
補充:瀏覽器查詢js物件中的屬性的順序:
a、查詢本物件中可列舉的屬性,有的話就返回,沒有的話執行b
b、再去查詢父 __proto__,從父元素繼承的屬性中可列舉的屬性,有的話就返回,沒有的話執行c
c、父物件的原型中也沒有物件的屬性的話,繼續找找父元素的__proto__,查詢父元素從父父元素(父元素的父元素)的可列舉屬性,有的話就返回,沒有的話繼續按照繼承原型鏈向上查詢,直到頂級物件 object
d、如果頂級物件object中的可列舉屬性中有該屬性的話就返回,沒有的話就返回undefined
JS原型和原型鏈
建立建構函式 function word words word.prototype 建立例項 var w new word hello world w.print function w.print hello world w.alert hello world function.prototype....
js原型鏈和原型
1 原型 在js中一切皆物件,那原型也是乙個物件,通過原型可以實現物件的屬性繼承,js的物件中包含著乙個 prototype 內部屬性,這個屬性所對應的就是物件的原型。prototype 作為物件的內部屬性不能被直接訪問,所以為了方便檢視乙個物件的原型,提供了 proto 這個非標準的訪問器,在js...
JS 原型和原型鏈
先宣告乙個建構函式 function people name,age 把類的方法寫在建構函式原型物件中,子類就不能再通過呼叫父類建構函式來繼承方法 屬性還是可以繼承 給people的原型新增方法 people.prototype.speak function 建立子類繼承people functio...