JavaScript共有屬性（原型）（prototype/proto）

tigerZH 發布于2019-08-26 12:01 / 1618人閱讀

摘要：這個就指向了類型的共有方法庫這個就表示類型的共有方法庫里所有的方法簡單類型和對象諸如像下面代碼所示，就是簡單類型的簡單聲明。

標題中，__proto__的__是由兩個_組成的

共有屬性（原型）

這個概念就是，一段代碼有諸多個對象，對象有很多的屬性、方法，把這么多個對象相同的屬性、方法提取出來，弄在一個新對象里，大家一起用。對象里就只要存儲新對象的地址，到時候要用到這些屬性、方法了，再調出來使用。

看下圖，簡易內存圖。左邊原始代碼區里聲明了新對象O1,var O1=new Object()，右邊Heap里存儲（從左往右看第一個箭頭的右邊都是Heap，沒有Stack）。左邊原始代碼區里又聲明了新對象O2,var O2=new Object()，右邊Heap里存儲。作為一個對象，有些方法是都有的，比如toString(),valueOf等，所以提取出來，放在共有屬性的Heap里，地址隨機為A100，那么O1，O2的Heap里就存放共有屬性的地址__proto__:A100。你寫代碼O1.toString()，就順著上面的箭頭找到O1的Heap，找一遍沒有，又找到__proto__里好像有東西，就找到了共有屬性的Heap，里面有toString()方法。

__proto__ 和 prototype的區別

個人理解，__proto__是個地址，用于指向另一個對象，比如某個共有方法庫。prototype就是本個對象所有方法的集合。

var a=new Number(1);
a.__proto__                //這個就指向了Number類型的共有方法庫
a.__proto__.prototype      //這個就表示Number類型的共有方法庫里所有的方法

簡單類型和對象

諸如像下面代碼所示，就是簡單類型的簡單聲明。這樣子聲明的變量只包含簡單類型值，沒有別的像toString(),valueOf,toFixed......等等的方法

var a=1;
var b="abc";
var c=true;

諸如像下面代碼所示，就是簡單類型的對象聲明。這樣子聲明的變量除了包含簡單類型值，還自帶了一些類型專屬方法和對象方法等等的方法

var a=new Number(1);
var b=new String("abc");
var c=new Boolean(true);

類型專屬方法和對象方法就是上面講的共有屬性（原型）。這就好像，所有的Number類型有自己的方法庫，所有的String類型有自己的方法庫，所有的Boolean類型有自己的方法庫，這些都是對象，所以最后所有Object類型有一個最最通用的方法庫。畫成圖如下圖。

S1，S2 → String類型 → 自己的Heap → String類型方法庫 → Object方法庫

n1，n2 → Number類型 → 自己的Heap → Number類型方法庫 → Object方法庫

b1，b2 → Boolean類型 → 自己的Heap → Boolean類型方法庫 → Object方法庫

o1，o2 → Object類型 → 自己的Heap → Object方法庫

簡單聲明和對象聲明的區別

講道理，用起來沒啥區別，方法該調用的調用，屬性該有的都一樣有。但實際上，是JavaScript自己做了處理的，方便了開發人員。

你先用簡單聲明聲明一個簡單類型var n=1

簡單類型缺點是，它就是一個值，啥也沒有，想對它進行各種操作，不行

怎么辦！這樣也太傻太沒用了吧?。∧牵R時轉換下吧~~~

臨時轉換：

當你寫下這樣的代碼var b=n.toString();

建立臨時變量temp，var temp=new Number(n)

這樣就可以調用temp的toString()方法了，temp.toString()

好了，臨時轉換好了，正確返回了n.toString()

最后刪除臨時變量temp，結束，temp來了、做了、走了

再來看看內存圖

左邊原始代碼區，簡單聲明變量var n=1;，中間Stack里存儲n的值

調用方法n.toString()，Stack里建立新變量temp，這是個對象，所以Heap里存儲temp的所有內容，Stack里存儲Heap地址ADDR 6

這樣n.toString()，就等于temp.toString()

返回temp.toString()后，temp就被磨滅了，Heap里的內容也隨之消失

Number類型

兩種聲明方式

var a=1;
var b=new Number(1);

Number類型專屬方法

聲明了一個變量，輸出變量后看到，里面就只有一個東西__proto__，這是個地址，指向Number類型公用的方法庫

點開__proto__，看到的就是Number類型共用的方法庫

里邊看到還有個__proto__，因為Number類型也是對象呀，所以這個__proto__指向Object類型公用的方法庫。點開這個__proto__，就看到了Object類型公用的方法庫

Number類型常用方法

toString()
toFixed()
toExponential()
valueOf()

charCodeAt(0)
toString(16)

String類型

兩種聲明方式

var a="abc";
var b=new String("abc");

String類型專屬方法

聲明了一個變量，輸出變量后看到，里面除了這個String對象的信息，還有一個東西__proto__，這是個地址，指向String類型公用的方法庫

點開__proto__，看到的就是String類型共用的方法庫

。
。
。

里邊看到還有個__proto__，因為String類型也是對象呀，所以這個__proto__指向Object類型公用的方法庫。點開這個__proto__，就看到了Object類型公用的方法庫

String類型常用方法

trim()
concat()
slice()

Boolean類型

兩種聲明方式

var a=true;
var b=new Boolean(true);

Boolean類型專屬方法

聲明了一個變量，輸出變量后看到，里面就只有一個東西__proto__，這是個地址，指向Boolean類型公用的方法庫

點開__proto__，看到的就是Boolean類型共用的方法庫

里邊看到還有個__proto__，因為Boolean類型也是對象呀，所以這個__proto__指向Object類型公用的方法庫。點開這個__proto__，就看到了Object類型公用的方法庫

Boolean類型常用方法

Object類型

兩種聲明方式

var a={name:1};
var b=new Object({name:1});

Object類型專屬方法

聲明了一個變量，輸出變量后看到，里面對象a基本信息，還有一個東西__proto__，這是個地址，指向Object類型公用的方法庫

點開__proto__，a本身就是對象沒有別的類型，所以看到的就是Object類型共用的方法庫

Object類型常用方法

toString()
valueOf()

GPU云服務器云服務器 javascript__ajax _javascript _JavaScript_API _JavaScript_MVC

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/108024.html

原型鏈一：原型與原型鏈

摘要：說白了，原型就是構造函數用來構造新實例的模板對象。什么是原型鏈先回答什么是原型。例如這個原型的原型就是這個構造函數的，既這個原型對象。這些原型對象通過像鏈子一樣連起來，就叫做原型鏈。原型鏈初步學習這篇博客只是我初步理解原型鏈的一個個人學習筆記,寫的比較粗略,且有的地方可能理解錯誤. 更多更專業的關于原型鏈的解釋請看JavaScript深入之從原型到原型鏈和阮一峰的博客:Javas...

MudOnTire 2019-08-22 17:04 評論0 收藏0
JS面向對象二:this/原型鏈/new原理

摘要：情況沒有明確作用對象的情況下，通常為全局對象例如函數的回調函數，它的就是全局對象。正因如此，機器可以作為這類對象的標志，即面向對象語言中類的概念。所以機器又被稱為構造函數。原型鏈也就是繼承鏈。 JS面向對象二:this/原型鏈/new原理阮一峰JavaScript教程:面向對象編程阮一峰JavaScript教程:實例對象與 new 命令阮一峰JavaScript教程:this 關...

anRui 2019-08-26 12:17 評論0 收藏0
淺談：快速理解JS的原型與原型鏈

摘要：中有基本類型和復雜類型的區分。原型與原型鏈這里，就引入了兩個新的概念。原型對象就是用來存放聲明對象中共有的那部分屬性。而原型對象自身也是一個對象，它也有自己的原型對象。這樣層層上溯，就形成了一個類似鏈表的結構，這就是原型鏈。 JavaScript中有基本類型和復雜類型的區分。當我們在聲明一個基本類型時： var n1= 1; console.log(n1); //1 這時我們可以用N...

ZoomQuiet 2019-08-23 14:11 評論0 收藏0
JS題目總結:原型鏈/new/json/MVC/Promise

摘要：數據管理，包括數據邏輯數據請求數據存儲等功能。負責處理的事件，并更新也負責監聽的變化，并更新，控制其他的所有流程。上面代碼就是一個最簡單的類，構造函數創建出來的對象自身有屬性，其原型上面有一個屬性。 JS題目總結:原型鏈/new/json/MVC/Promise 1原型鏈相關 showImg(https://segmentfault.com/img/remote/14600000161...

biaoxiaoduan 2019-08-26 12:18 評論0 收藏0
原型與原型鏈

摘要：全局對象規定全局對象叫做，但是瀏覽器把作為全局對象瀏覽器先存在的。就是一個哈希表，里面含有很多屬性。對象表示一個包含文檔的窗口，其屬性指向窗口中載入的文檔。使用屬性可以獲取指定文檔所在窗口。在標簽瀏覽器比如中，每個標簽具有自己的對象。全局對象 ECMAScript規定全局對象叫做global，但是瀏覽器把window作為全局對象（瀏覽器先存在的）。window就是一個哈希表，里面含有...

denson 2019-08-22 18:34 評論0 收藏0