當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JavaScript prototype整理(网上的三种理解)
生活随笔
收集整理的這篇文章主要介紹了
JavaScript prototype整理(网上的三种理解)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
prototype屬性,只有function對象中才具有的顯式屬性;?
網上三種理解:?
??????????? 1:通過構造函數創建的普通對象,通過其constructor屬性引用它的構造函數對象,從而間接引用(擁有)了構造對象中的prototype對象;?
如圖:
此觀點的文章:?? 參看 jimichan的文章: 詳解javascript類繼承機制的原理? 中的:? “(說成間接的是因為每個object都有一個 constructor 屬性指向它的構造函數)。” ?
非常感謝在此問題上,作者對我的回信;如有冒犯,敬請原諒; ?
??????????? 2:構造函數創建對象時,copy prototype中的屬性和代碼給所創建的對象。從而使創建的對象擁有了prototype中的所有功能和屬性;?
如圖:
此觀點的文章:?? 參看 yiding_he的文章: 領悟 JavaScript 中的面向對象 ?中的:?? “ 在 JavaScript 中,用 new 關鍵字創建對象是執行了下面三個步驟的:?
?? 1. 創建一個新的普通對象;?
?? 2. 將方法對象的 prototype 屬性的所有屬性復制到新的普通對象中去。?
?? 3. 以新的普通對象作為上下文來執行方法對象。” ?
此觀點在回貼中被 xieye反對 ?
??????????? 3:構造函數在創建對象時,把構造函數中的prototype引用賦給創建的普通對象;也就是說由構造函數創建的對象,都有一個指針指向prototype對象;?
如圖:
此觀點的文章:?? 參看 李站的文章: 悟透javascript 中的 " 我們已經知道,用 var anObject = new aFunction() 形式創建對象的過程實際上可以分為三步:第一步是建立一個新對象;第二步將該對象內置的原型對象設置為構造函數prototype引用的那個原型對象;第三步就是將該對象作為this參數調用構造函數,完成成員設置等初始化工作。對象建立之后,對象上的任何訪問和操作都只與對象自身及其原型鏈上的那串對象有關,與構造函數再扯不上關系了" ?? 以及?? “語法甘露 中的:上面代碼的最后一句證明,新創建的對象的constructor屬性返回的是Object函數。其實新建的對象自己及其原型里沒有constructor屬性,那返回的只是最頂層原型對象的構造函數,即Object。”?
綜上所述:根據貼子: 領悟 JavaScript 中的面向對象 ?中作者 afcn0的回貼? “其實還有補充,就是如果構造函數返回object類型,那new對象無效,prototype問題是樓主還不太了解prototype繼承方式,__proto__屬性,以及isPrototypeOf方法所至 ” ?的提示,查閱了文章: javascript中的繼承 ?
Html代碼?? 此文中提到:jane?=?new?Engineer("Doe,?Jane",?["navigator",?"javascript"],?"belau");?? ?? 調用這句時,都發生了什么:?? ?? 1 ?當js看見new操作符,它創建一個新的普通對象,并且設置它的__proto__?屬性為Engineer.prototype。?? ?? 2?new?操作符傳遞這個新的對象作為Engineer?構造器的this的值。?? ?? 其實最主要做的事就是上面的兩件,剩下的都是很簡單的函數調用.??
根據上文的提示作了簡單測試:?
Javascript代碼?? function?person(name,b){?? ????this.name=name;?? }?? ?? person.prototype.sayHello=function(a){?? ????//alert("hello,i?am?"+this.name);?? ????alert(this==a);?? ????}?? ?? ?? function?employee(name,?salary)?? {?? ????person.call(this,?name);????//調用上層構造函數?? ????this.salary?=?salary;???????//擴展的成員?? };?? ?? var?p=new?person("yangsp",p);?? //p.sayHello(p);?? //alert(p.constructor);?? ?? //下面兩句驗證了普通對象中確有_proto_屬性,且引用的是prototype對象;(在ff下調試,ie下不可);?? alert(p.__proto__==person);?? alert(p.__proto__==person.prototype))?? ?? //alert("p有prototype屬性嗎??"+p.prototype);????//表明普通對象中沒有prototype屬性;???????????????????????????????
總結: Html代碼?? 比較贊同第三種理解;?? ??????即:prototype是function對象中專有的屬性。?? ??????????_proto_是普通對象的隱式屬性,在new的時候,會指向prototype所指的對象;?? ??????????普通對象中的constructor屬性指向構造函數,因此一個用構造函數創建的對象可能有兩種方式關聯到prototype.但繼承應該是根據_proto_關聯到prototype屬性;??
另外: ecma-262 中提到:every object created by that constructor has an implicit reference to the prototype (called the object's prototype) associated with its constructor 以及其圖示;不敢肯定它的implicit reference間接還是隱式鏈接;?
感謝所有提借幫助的作者。若有冒犯,敬請原諒;由于本人是新手,所有結論都是根據網上資源整理后自己猜測得出的;所以會有很多錯誤,真誠期待你的指正; ?
網上三種理解:?
??????????? 1:通過構造函數創建的普通對象,通過其constructor屬性引用它的構造函數對象,從而間接引用(擁有)了構造對象中的prototype對象;?
如圖:
此觀點的文章:?? 參看 jimichan的文章: 詳解javascript類繼承機制的原理? 中的:? “(說成間接的是因為每個object都有一個 constructor 屬性指向它的構造函數)。” ?
非常感謝在此問題上,作者對我的回信;如有冒犯,敬請原諒; ?
??????????? 2:構造函數創建對象時,copy prototype中的屬性和代碼給所創建的對象。從而使創建的對象擁有了prototype中的所有功能和屬性;?
如圖:
此觀點的文章:?? 參看 yiding_he的文章: 領悟 JavaScript 中的面向對象 ?中的:?? “ 在 JavaScript 中,用 new 關鍵字創建對象是執行了下面三個步驟的:?
?? 1. 創建一個新的普通對象;?
?? 2. 將方法對象的 prototype 屬性的所有屬性復制到新的普通對象中去。?
?? 3. 以新的普通對象作為上下文來執行方法對象。” ?
此觀點在回貼中被 xieye反對 ?
??????????? 3:構造函數在創建對象時,把構造函數中的prototype引用賦給創建的普通對象;也就是說由構造函數創建的對象,都有一個指針指向prototype對象;?
如圖:
此觀點的文章:?? 參看 李站的文章: 悟透javascript 中的 " 我們已經知道,用 var anObject = new aFunction() 形式創建對象的過程實際上可以分為三步:第一步是建立一個新對象;第二步將該對象內置的原型對象設置為構造函數prototype引用的那個原型對象;第三步就是將該對象作為this參數調用構造函數,完成成員設置等初始化工作。對象建立之后,對象上的任何訪問和操作都只與對象自身及其原型鏈上的那串對象有關,與構造函數再扯不上關系了" ?? 以及?? “語法甘露 中的:上面代碼的最后一句證明,新創建的對象的constructor屬性返回的是Object函數。其實新建的對象自己及其原型里沒有constructor屬性,那返回的只是最頂層原型對象的構造函數,即Object。”?
綜上所述:根據貼子: 領悟 JavaScript 中的面向對象 ?中作者 afcn0的回貼? “其實還有補充,就是如果構造函數返回object類型,那new對象無效,prototype問題是樓主還不太了解prototype繼承方式,__proto__屬性,以及isPrototypeOf方法所至 ” ?的提示,查閱了文章: javascript中的繼承 ?
Html代碼??
根據上文的提示作了簡單測試:?
Javascript代碼??
總結: Html代碼??
另外: ecma-262 中提到:every object created by that constructor has an implicit reference to the prototype (called the object's prototype) associated with its constructor 以及其圖示;不敢肯定它的implicit reference間接還是隱式鏈接;?
感謝所有提借幫助的作者。若有冒犯,敬請原諒;由于本人是新手,所有結論都是根據網上資源整理后自己猜測得出的;所以會有很多錯誤,真誠期待你的指正; ?
總結
以上是生活随笔為你收集整理的JavaScript prototype整理(网上的三种理解)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: javascript必知必会之proto
- 下一篇: 细说JavaScript中对象的属性和方