JavaScript，從示例理解重寫原型后的指針指向

godlong_X 發(fā)布于2019-08-21 10:32 / 1113人閱讀

摘要：我們知道，調(diào)用構(gòu)造函數(shù)時(shí)會(huì)為實(shí)例添加一個(gè)指向最初原型的指針，而把原型修改為另外一個(gè)對(duì)象就等于切斷了構(gòu)造函數(shù)與最初原型之間的聯(lián)系。

  我們知道，調(diào)用構(gòu)造函數(shù)時(shí)會(huì)為實(shí)例添加一個(gè)指向最初原型的指針，而把原型修改為另外一個(gè)對(duì)象就等于切斷了構(gòu)造函數(shù)與最初原型之間的聯(lián)系。

怎么理解這句話，下面我們通過(guò)實(shí)例來(lái)解釋下，如有不對(duì)，請(qǐng)指正，虛心受教。

function Person(){

}

Person.prototype.sayName=function(){
    alert("TONY");
}
var friend1=new Person();
var keys1=Object.keys(Person.prototype);

//重寫原型
Person.prototype = {
         constructor:Person,
         name:"TIMY",
         age:29,
         job:"SOFT ENGINEER",
         sayName:function(){
             alert(this.name);
         }
     };

var friend2=new Person();
var keys2=Object.keys(Person.prototype);

friend1.sayName();  //TONY
friend2.sayName();  //TIMY
alert(keys1);       //sayName
alert(keys2);       //constructor,name,age,job,sayName

為什么friend1和friend2輸出的結(jié)果不同，因?yàn)閒riend1時(shí)還沒(méi)有重寫，friend2時(shí)已經(jīng)重寫原型。

那么問(wèn)題來(lái)了，這中間指針是怎么指向的？

因?yàn)樵趯?shí)例化的時(shí)候，firend1的原型指針指向了構(gòu)造函數(shù)的原型對(duì)象，這個(gè)的原型對(duì)象只有一個(gè)sayName方法，輸出的是TONY。

隨后，給構(gòu)造函數(shù)附上了新的原型對(duì)象，即將構(gòu)造函數(shù)指向新的原型對(duì)象，但是實(shí)例friend1的原型指針依然還傻傻的指向原來(lái)的空原型對(duì)象{}

這個(gè)時(shí)候再實(shí)例化的對(duì)象friend2，就有了新的原型的sayName方法了，輸出是TIMY。

其實(shí)通過(guò)Object.keys(Person.prototype)語(yǔ)句就看出了不同情況下原型的所有屬性和方法。
重寫前指向的是最初原型，只有一個(gè)sayName方法，重寫后，構(gòu)造函數(shù)就指向了新的原型，雖然新的原型也有sayName方法，但是注意，這已經(jīng)不是之前的了，只是名字相同而已。

就醬紫滴，還在學(xué)習(xí)中。。。

GPU云服務(wù)器云服務(wù)器指針指向指針指針指向c++free 指向函數(shù)的指針 javascript原型

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/85699.html

相關(guān)文章

我來(lái)重新學(xué)習(xí) javascript 的面向?qū)ο螅╬art 2）

摘要：先來(lái)說(shuō)其實(shí)構(gòu)造函數(shù)也有，原型對(duì)象有，實(shí)例有也有，或者更加籠統(tǒng)的說(shuō)，所有對(duì)象都是有的。構(gòu)造函數(shù)的原型對(duì)象上的會(huì)指向構(gòu)造函數(shù)。由于屬性是可以變更的，所以未必真的指向?qū)ο蟮臉?gòu)造函數(shù)，只是一個(gè)提示。續(xù)上一集內(nèi)容，通過(guò)構(gòu)造函數(shù)的方式，成功地更新了生產(chǎn)技術(shù)，老板笑呵呵，工人少奔波，只是問(wèn)題總比辦法多，又遇到一個(gè)新問(wèn)題，就是會(huì)造成一些資源的重復(fù)和浪費(fèi)，那么經(jīng)過(guò)工程師們的智慧交流，他們產(chǎn)生了一個(gè)新技...

silvertheo 2019-08-26 12:19 評(píng)論0 收藏0
《JavaScript 闖關(guān)記》之原型及原型鏈

摘要：像和這樣的原生構(gòu)造函數(shù)，在運(yùn)行時(shí)會(huì)自動(dòng)出現(xiàn)在執(zhí)行環(huán)境中。理解原型對(duì)象在默認(rèn)情況下，所有原型對(duì)象都會(huì)自動(dòng)獲得一個(gè)構(gòu)造函數(shù)屬性，這個(gè)屬性包含一個(gè)指向?qū)傩运诤瘮?shù)的指針。而通過(guò)這個(gè)構(gòu)造函數(shù)，我們還可繼續(xù)為原型對(duì)象添加其他屬性和方法。原型鏈?zhǔn)且环N機(jī)制，指的是 JavaScript 每個(gè)對(duì)象都有一個(gè)內(nèi)置的 __proto__ 屬性指向創(chuàng)建它的構(gòu)造函數(shù)的 prototype（原型）屬性。原型鏈的...

cjie 2019-08-21 11:19 評(píng)論0 收藏0
JavaScript高程第六章:繼承-理解與實(shí)踐

摘要：高程第六章繼承理解與實(shí)踐昨日細(xì)細(xì)的讀了一遍高程現(xiàn)在寫篇文章來(lái)鞏固下認(rèn)知吧讀首先是從中讀到了什么我自己也在讀書的時(shí)候用筆記下了各個(gè)部分的點(diǎn)現(xiàn)在等于閱讀筆記回憶下書本理解基礎(chǔ)第五版中規(guī)定了兩種屬性數(shù)據(jù)屬性訪問(wèn)器屬性數(shù)據(jù)屬性包含一個(gè)數(shù)據(jù)值的位 JavaScript高程第六章:繼承-理解與實(shí)踐昨日細(xì)細(xì)的讀了一遍JavaScript高程,現(xiàn)在寫篇文章來(lái)鞏固下認(rèn)知吧. 讀首先是從中讀到了什么,我...

mozillazg 2019-08-20 11:13 評(píng)論0 收藏0
JS面向?qū)ο蟮某绦蛟O(shè)計(jì)之繼承的實(shí)現(xiàn) - 原型鏈

摘要：簡(jiǎn)單回顧一下構(gòu)造函數(shù)原型和實(shí)例對(duì)象之間的關(guān)系每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象。找到生成構(gòu)造函數(shù)的原型對(duì)象的構(gòu)造函數(shù)，搜索其原型對(duì)象，找到了。 JS面向?qū)ο蟮某绦蛟O(shè)計(jì)之繼承的實(shí)現(xiàn) - 原型鏈前言：最近在細(xì)讀Javascript高級(jí)程序設(shè)計(jì)，對(duì)于我而言，中文版，書中很多地方翻譯的差強(qiáng)人意，所以用自己所理解的，嘗試解讀下。如有紕漏或錯(cuò)誤，會(huì)非常感謝您的指出。文中絕大部分內(nèi)容引用自《JavaS...

zhaochunqi 2019-08-23 12:22 評(píng)論0 收藏0
基礎(chǔ)二：javascript面向?qū)ο?、?chuàng)建對(duì)象、原型和繼承總結(jié)（上）

摘要：創(chuàng)建對(duì)象兩個(gè)基本方法創(chuàng)建對(duì)象最基本的兩個(gè)方法是構(gòu)造函數(shù)和對(duì)象字面量。當(dāng)調(diào)用構(gòu)造函數(shù)創(chuàng)建一個(gè)新的實(shí)例對(duì)象后，該實(shí)例內(nèi)部會(huì)有一個(gè)指針指向構(gòu)造函數(shù)的原型對(duì)象。碼農(nóng)構(gòu)造函數(shù)在不返回值的情況下，默認(rèn)會(huì)返回新對(duì)象實(shí)例。前言：本文主要總結(jié)一下javascript創(chuàng)建對(duì)象的方法、原型、原型鏈和繼承，但是先從創(chuàng)建對(duì)象的幾種方法開(kāi)始，延伸到原型模式創(chuàng)建對(duì)象以及其它模式。繼承本來(lái)想一塊寫了，發(fā)現(xiàn)太多內(nèi)容了...

fevin 2019-08-19 18:46 評(píng)論0 收藏0