在學習原型這部分知識的時候,我一般通過這個圖來了解建構函式,原型物件和例項之間的關係,同時也搞清楚屬性中,prototype和__proto__的區別。
先簡單說一下,建構函式和普通函式唯一的區別就是呼叫方式不同,除此之外,它們都是函式。那也就是說,任何只要使用new操作符呼叫就是建構函式。那麼重點就來了:
每個函式都會建立乙個prototype屬性,也就是原型物件。原型物件當中有乙個constructor屬性指向這個建構函式。
function
person
(name, age, ***)
}let p1 =
newperson
("dede",18
,"male");
console.
dir(person)
;
我們在chrome瀏覽器中可以看到
person這個建構函式的prototype屬性,其實也就是person.prototype(原型物件)。接著,關注下prototype中的constructor指向了person的建構函式,我們會發現constructor和prototype二者迴圈引用。
那麼我們看person創造出來的例項情況如何
可以出來,p1這個例項是只有__proto__,而沒有prototype這個屬性。這是因為通過建構函式new出來的例項是沒有prototype的屬性的。這個__proto__指向的就是person.prototype,也就是person的原型物件。那麼我們可以總結出來,例項和建構函式是沒有直接關係的,它們都與原型物件有直接關係。說到這裡,可能還是沒有搞清楚prototype和__proto__到底有啥區別。那麼我們執行下這段**。
console.
log(p1.__proto__ === person.prototype)
;//例項通過__proto__鏈結到原型物件,建構函式通過prototype鏈結到原型物件。
console.
log(person.__proto__ === function.prototype)
;console.
log(function.__proto__.__proto__ === object.prototype)
;
列印出來的結果都為true。
只有建構函式(函式)才有prototype,new出來的例項只有__proto__。
例項和建構函式沒有直接關係,它們都與原型物件有直接關係。那麼,例項也就是通過原型物件來共享建構函式中的方法和屬性。
每個函式都會自己的constructor,constructor和原型物件兩者迴圈引用。
原型及原型鏈相關理解
下面是可能用到的知識點 var o1 普通物件 function f1 函式物件 f1.prototype 原型物件 function person name,age,job 每個物件都有 proto 屬性,但只有函式物件才有 prototype 屬性 有constructor才能夠例項化 將per...
原型鏈,函式的相關屬性
原型鏈的概念 繪製原型鏈 object.prototype 的方法簡介 hasownproperty isprototypeof propertyisenumerable 裝箱 與 拆箱 強調幾點 instanceof介紹 function function foo fnname var fnnam...
原型鏈學習總結
學習於 定義物件a 和b a.proto b。1 當a.ss時在自身物件找不到該屬性則會往繼承的原型上去找,也就是輸出b.ss。a 和b a.proto b console.log a.ss 2 2 修改原型上的值,即b.ss 3 則a.ss也等於3。a 和b a.proto b b.ss 3 co...