<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型鏈</title>
</head>
<body>
<script>
知識點:
1:實例對象與原型之間的連接,叫做原型鏈
2:_proto_或([[prototype]]) (隱式鏈接),存在於實例 對象中,這個屬性對腳本是不可見的
3:Object對象類型是原型鏈的最外層(Object.prototype)
原型對象:
無論什麼時候,只要我們創建一個新函數,就會根據一個特定的組織規則,爲該函數創建一個prototype屬性,
這個屬性指向函數的原型對象,在默認情況下,原型對象會自動獲取一個constructor(構造函數)屬性,
它是一個指針,指向prototype屬性所在的函數
demo:
function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
}
var person1 = new Person();
person1.sayName(); // "Nicholas"
var person2 = new Person();
person2.sayName(); //"Nicholas"
alert(person1.sayName == person.sayName);
Demo 中 我們創建了一個構造函數Person,這時候系統會默認給Person對象添加一個prototype屬性,
這個屬性指向Person 對象的原型對象,當然系統也會給原型對象添加一個constructor屬性,這個屬性是一個指針,指向prototype
屬性所在的函數(既Person構造函數)。此時我們沒有給Person原型對象添加屬性和方法,但是object對象的原型上的方法
我們卻可以訪問,因爲object對象的原型對象是原型鏈上的最外層。然後我們給Person對形象的原型上添加了3個屬性和一個
方法,這三個屬性和一個方法將會被Person對象的所有實例對象共享,如實例對象person1和person2都能調用sayName方法
,並且這個兩個實例對象調用的是同一個方法,的到的結果也相同。
然後我們通過構造函數(new)創建了兩個實例對象person1和person2,系統會默認的給這兩個實力對象添加一個屬性[[prototype]]
它是一個指針,它指向構造函數的原型對象,雖然在腳本中沒有標準的方式來訪問這個屬性,但是在firefox和chrome中,我們可以
通過_proto_來實現訪問,這個鏈接(_proto_)存在於實例對象與構造函數的原型對象之間,而不是存在於實例對象與構造函數之間
具體流程我們可以看下圖
</script>
</body>
</html>
![]()
