javascript原型是什么_javascript常用框架介紹 - javascript原型是什么_javascript常用框架介紹

　　圖解實例

　　通過上面結合實例的分析，相信你一定了解了原型中的很多內容。

　　但是現(xiàn)在肯定對上面例子中的關系感覺很凌亂，一會兒原型，一會兒原型的原型，還有Function，Object，constructor，prototype等等關系。

　　現(xiàn)在就對上面的例子中分析得到的結果/關系進行圖解，相信這張圖可以讓你豁然開朗。

　　對于上圖的總結如下：

　　所有的對象都有“__proto__”屬性，該屬性對應該對象的原型

　　所有的函數對象都有“prototype”屬性，該屬性的值會被賦值給該函數創(chuàng)建的對象的“__proto__”屬性

　　所有的原型對象都有“constructor”屬性，該屬性對應創(chuàng)建所有指向該原型的實例的構造函數

　　函數對象和原型對象通過“prototype”和“constructor”屬性進行相互關聯(lián)

　　通過原型改進例子

　　在上面例子中，“getInfo”方法是構造函數Person的一個成員，當通過Person構造兩個實例的時候，每個實例都會包含一個“getInfo”方法。

　　var will = new Person（“Will”， 28）;

　　var wilber = new Person（“Wilber”， 27）;

　　前面了解到，原型就是為了方便實現(xiàn)屬性的繼承，所以可以將“getInfo”方法當作Person原型（Person.__proto__）的一個屬性，這樣所有的實例都可以通過原型繼承的方式來使用“getInfo”這個方法了。

　　所以對例子進行如下修改：

　　function Person（name， age）{

　　this.name = name;

　　this.age = age;

　　}

　　Person.prototype.getInfo = function（）{

　　console.log（this.name + “ is ” + this.age + “ years old”）;

　　};

　　修改后的結果為：

　　原型鏈

　　因為每個對象和原型都有原型，對象的原型指向對象的父，而父的原型又指向父的父，這種原型層層連接起來的就構成了原型鏈。

　　在“理解JavaScript的作用域鏈”一文中，已經介紹了標識符和屬性通過作用域鏈和原型鏈的查找。

　　這里就繼續(xù)看一下基于原型鏈的屬性查找。

　　屬性查找

　　當查找一個對象的屬性時，JavaScript 會向上遍歷原型鏈，直到找到給定名稱的屬性為止，到查找到達原型鏈的頂部（也就是 “Object.prototype”）， 如果仍然沒有找到指定的屬性，就會返回 undefined。

　　看一個例子：

　　function Person（name， age）{

　　this.name = name;

　　this.age = age;

　　}

　　Person.prototype.MaxNumber = 9999;

　　Person.__proto__.MinNumber = -9999;

　　var will = new Person（“Will”， 28）;

　　console.log（will.MaxNumber）;

　　// 9999

　　console.log（will.MinNumber）;

　　// undefined

　　在這個例子中分別給“Person.prototype ”和“ Person.__proto__”這兩個原型對象添加了“MaxNumber ”和“MinNumber”屬性，這里就需要弄清“prototype”和“__proto__”的區(qū)別了。

　　“Person.prototype ”對應的就是Person構造出來所有實例的原型，也就是說“Person.prototype ”屬于這些實例原型鏈的一部分，所以當這些實例進行屬性查找時候，就會引用到“Person.prototype ”中的屬性。