原型是JAVAScript中一個比較難理解的概念,原型相關的屬性也比較多,對象有”prototype”屬性,函數對象有”prototype”屬性,原型對象有”constructor”屬性。
一、初識原型
在JavaScript中,原型也是一個對象,通過原型可以實現對象的屬性繼承,JavaScript的對象中都包含了一個”[[Prototype]]”內部屬性,這個屬性所對應的就是該對象的原型。
“[[Prototype]]”作為對象的內部屬性,是不能被直接訪問的。所以為了方便查看一個對象的原型,Firefox和Chrome中提供了__proto__這個非標準(不是所有瀏覽器都支持)的訪問器(ECMA引入了標準對象原型訪問器”Object.getPrototype(object)”)。在JavaScript的原型對象中,還包含一個”constructor”屬性,這個屬性對應創建所有指向該原型的實例的構造函數
二、規則
在JavaScript中,每個函數都有一個prototype屬性,當一個函數被用作構造函數來創建實例時,這個函數的prototype屬性值會被作為原型賦值給所有對象實例(也就是設置實例的`__proto__`屬性),也就是說,所有實例的原型引用的是函數的prototype屬性。(****`只有函數對象才會有這個屬性!`****)
new 的過程分為三步:
var p = new Person('張三',20);
1. var p={}; 初始化一個對象p。
2. p._proto_=Person.prototype;,將對象p的 __proto__ 屬性設置為 Person.prototype
3. Person.call(p,”張三”,20);調用構造函數Person來初始化p。
三、初識Object
Object對象本身是一個函數對象。
既然是Object函數,就肯定會有prototype屬性,所以可以看到”Object.prototype”的值就是”Object{}”這個原型對象。反過來,當訪問”Object.prototype”對象的”constructor”這個屬性的時候,就得到了Obejct函數。
另外,當通過”Object.prototype._proto_”獲取Object原型的原型的時候,將會得到”null”,也就是說”Object {}”原型對象就是原型鏈的終點了。
四、初識Function
如上面例子中的構造函數,JavaScript中函數也是對象,所以就可以通過_proto_查找到構造函數對象的原型。
Function對象作為一個函數,就會有prototype屬性,該屬性將對應”function () {}”對象。
Function對象作為一個對象,就有__proto__屬性,該屬性對應”Function.prototype”,也就是說,”Function._proto_ === Function.prototype”。
如若轉載,請注明出處:開源字節
https://sourcebyte.cn/article/149.html