首頁  >  文章  >  web前端  >  javascript物件的property和prototype關係

javascript物件的property和prototype關係

黄舟
黄舟原創
2016-12-14 15:56:25881瀏覽

ECMAScript可以識別兩種類型的對象,一種叫做Native Object屬於語言範疇;一種叫做Host Object,由運行環境提供例如document對象,Dom Node等 
Native objects是一種鬆散的結構並且可以動態的增加屬性(property),所有的屬性都有一個名字和一個值,這個值可以是另一個物件的引用或是內建的資料型別(String, Number, Boolean, Null 或Undefined) 
下面的這個簡單的例子描述了一個javascript物件是如何設定一個屬性的值和如何讀取屬性的值的。

賦值操作 
一個物件的屬性的建立非常簡單,直接透過賦值運算就可以完成屬性的建立。


程式碼
var objectRef = new Object(); //create a generic javascript object.   

一個名為testNumber的屬性可以這樣建立。

代碼
objectRef.testNumber = 5;    
/* - or:- */   
objectRef["testNumber"] = 5;   

如果復制的屬性名稱已經存在那麼不會再次創建這個屬性,賦值操作僅僅是重新設定屬性的值

程式碼
objectRef.testNumber = 8;    
/* - or:- */   
objectRef["testNumber"] = 8;   

objectRef["testNumber"] = 8;   

objectRef["testNumber"] = 8;   
objectRef["testNumber"] = 8;   
objectRef["testNumber"] = 8;   

objectRef["testNumber"] = 8;   

objectRef["testNumber"] = 8;   ,也可以有屬性(property),對於js物件的(prototype)的賦值運算跟普通物件屬性的建立 
沒什麼不同。

取值操作 
在取值操作中property和prototype就不一樣了,先看最簡單的property取值操作。

程式碼
/*為一個物件的屬性賦值,如果這個物件沒有這個屬性,那麼在賦值運算後,這個物件就有這個屬性了*/   
objectRef.testNumber = 8;    
/* 讀出這個屬性的值*/   

var val = objectRef.testNumber;    

   

/* 現在val 得到了剛才賦予objectRef的值8了*/  

prototypes那麼他也可以有prototypes,這樣循環下去就形成了一個prototype鏈, 
這個鏈當他遇到鏈中隊形的prototype是null時中止。 (Object的預設的prototype是null)

程式碼
var objectRef = new Object(); //create a generic javascript object.   

存在新的js物件,這時這個物件的prototype鏈只包含一個物件Object.prototype 
我們在看下面的程式碼

程式碼
/* 建構MyObject1這個類型的建構子   
   MyObject   /* 為者對象創建一個屬性名字叫做testNumber   
    */   
    this.testNumber = formalParameter;    
}    :-   
*/   
function MyObject2(formalParameter){    
   /* 為者物件建立一個屬性名字叫做testString*/   
    this.testString = formalParameter;    
}     
   遠8 );
   
/* 最後我們建立MyObject2類型的一個物件*/   
   
var objectRef = new MyObject2( "String_Value" );   
objectRef對象,MyObject1對像也有prototype, 
這個prototype是Object預設的prototype,Object.prototype的prototype是null,至此這條prototype鏈結束。
當一個取值操作發生時,objectRef 的整個prototype鏈就開始工作

程式碼
var val = objectRef.testString;   

objectRef這個物件的有一個屬性的關鍵給val

程式碼
var val = objectRef.testNumber;   

在objectRef這個物件裡並沒有testNumber這個屬性,但是val卻的到了值8,而不是undefine,這是因為解釋器在當前物件上找到要沒有在當前物件上找到要沒有在當前物件找 

的屬性後,就會去檢查這個物件的prototype,objectRef的prototype是MyObject1對象,這個物件有testNumber這個屬性,所以val得到8這個值。

程式碼
var val = objectRef.toString;   

現在val是個function的引用,這個function是Object.prototype的property,由於MyObject1和MyObject2都沒有定義toString這個都沒有定義toString這個都沒有定義到
所以Object.prototype

所以傳回。


程式碼

var val = objectRef.madeUpProperty;   


最後val是undefined,因為MyObject1和MyObject2,而Object都沒有定義madeUpPropertymproperty,所以得到的是undefine.Tipin.和prototype 鏈上發現的第一個同名屬性值 

寫入操作會為obj物件本身建立一個同名屬性(如果這個屬性名稱不存在 

這就表示objectRef.testNumber = 3會在objectRef物件上建立一個property,名字是testNumber,當下一次在要讀取testNumber時 
propertype鏈就不會運作,只要會得到objectRef的property 3,而MyObject1的testNumber屬性並不會被修改。 * 建構MyObject1這個類型的建構子   
   MyObject1 - type.   
*/   

function MyObject1(formalParameter){    🠎test 

    this.testNumber = formalParameter;    
}    
   
/ * 建構MyObject2這個類型的建構子   
   MyObject2 - type:-   
*/   
function MyObject2(formalParameter){   formalParameter;    
}    
   
/ * 下一步的操作會用MyObject1物件取代掉MyObject2預設的prototype屬性*/   
var obj1 = new MyObject1( 8 );    
MyObject2.prototype = ob
var objectRef = new MyObject2( "String_Value" );    
   
alert(objectRef.testNumber);    objectRef.testNumber = 5);    objectRef.testNumber = 5);
alert(obj1.testNumber);    

 更多相關文章請關注PHP中文網(www.php.cn)!




陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn