這篇文章主要介紹了JavaScript中的實例對象與原型對象,針對constructor屬性和prototype屬性展開來講,需要的朋友可以參考下

首先聲明：javascript中每個對象都有一個constructor屬性和一個prototype屬性。constructor指向對象的構造函數，prototype指向使用構造函數創建的對象實例的原型對象。

function Person(){ 

 } 

var person = new Person(); 

Person.prototype = { 

 constructor : Person, 

 name : 'zxs', 

 age : 24, 

 sayName : function(){alert(this.name)} 

 } 

person.sayName(); 

在這段代碼中會報錯，sayName() is not defined。根據javascript高級程序設計第二版的解釋，是因為重寫的原型切斷了構造函數與最初原型之間的聯系。但是我們調整一下上面語句的順序。如下：

function Person(){ 

 } 

//var person = new Person(); 

Person.prototype = { 

 constructor : Person, 

 name : 'zxs', 

 age : 24, 

 sayName : function(){alert(this.name)} 

} 

/*===========================================================*/

var person = new Person(); 

/*===========================================================*/

 person.sayName(); // zxs 

alert(person.constructor) //function Object() { [native code]} or function Person() {} 取決與藍色的語句是否有效 

注意上面兩段代碼等號中間的語句。按第二段的順序寫代碼，將會輸出 ”zxs“，這個結果說明在第一種情況下報錯并不能說明是因為切斷了構造函數與原想之間的聯系引起的。

Person.prototype = ｛｝ 

本來就是一種定義對象的方法，而且在javascript中每個對象的constructor屬性都默認的指向Object構造函數，這也就不難說明重寫原型對象確實切斷了構造函數與最初原型之間的聯系，但并不能說明這種聯系被切斷之后 person就不能訪問到sayName()函數。

現在有這樣的假設：函數的prototype屬性所指向的原型對象，與我們顯示新建的原型對象并不是完全等同的。當我們調用函數的時候會創建一個原型對象，此時會首先查找當前環境中是否存在其原型對象，如果程序中不存在，就創建一個，如果環境中存在，側查找他們的屬性和方法，最后根據查找的結果返回一個原型對象，這個對象中的屬性和方法總是優先使用默認原型中的屬性和方法，也就是構造函數中定義的屬性和方法。當當調用的方法或屬性不存在于默認的原型中時，才使用定義在Person.prototype = {} 的屬性和方法。

javascript是解釋性的語言，語句都是順序執行的，在第一段代碼中，當我們使用 new 關鍵字創建新對象的時候，Person.prototype = {} 并沒有執行，也就是說在當前的執行環境中找不到其中定義的方法和屬性，而構造函數中沒有該方法，所以出錯。就像一個變量，給他賦值的時候程序沒有執行將不能使用。在第二段中環境中已經存在該調用的方法，構造函數的原型對象已經創建完畢，所以可以得到結果。

再看下面的一段程序：

////////////////////////////////////////////////////////////////////////// 

function Person(){} 

/*===========================================================*/

 var person = new Person(); 

Person.prototype.name = 'song'; 

/*===========================================================*/

//Person.prototype.sayName = function(){alert(this.name)}; 

Person.prototype = { 

constructor : Person, 

name : 'zxs', 

age : 24, 

sayName : function(){alert(this.name)} 

} 

person.sayName(); // error 

////////////////////////////////////////////////////////////////////////// 

function Person(){  } 

/*var person = new Person();*/

Person.prototype.name = 'song';  

/*Person.prototype.sayName = function(){alert(this.name)};*/

Person.prototype = {   

constructor : Person, 

  name : 'zxs', 

  age : 24, 

  sayName : function(){alert(this.name)} 

} 

/*===========================================================*/

var person = new Person(); 

/*===========================================================*/

person.sayName(); // zxs 

從這里可以看出使用 Person.prototype.name = '',的方式不論在什么地方創建對象都能被訪問，如果同時存在對象字面量和這種方法定義原型對象，將使用后定義的作為最終值。并且對原型對象使用對象字面量定義之后，該定義必須出現在創建對象的語句之前才能被訪問到。

實例不能訪問到原型對象中的屬性和方法，不僅僅是因為重寫原型對象切斷了構造函數與最初原型之間的聯系。

function Person(){  

  }  

var person = new Person();  

Person.prototype = {  

  //constructor : Person,  

  name : 'zxs',  

  age : 24,  

  sayName : function(){alert(this.name)}  

  }  

person.sayName();  

以上代碼在實例化對象時構造函數的原型為空，它沒有任何除默認屬性以外的屬性。重寫構造函數的原型確實切斷了構造函數與最初原型之間的聯系。

在使用 new 操作符以后構造函數的原型對象中的屬性和方法已經添加到 person對象中。因為以上方法為函數原型添加新屬性和方法不具有動態性，所以person不能訪問到新添加的屬性和方法。

重寫原型對象之后，就如同如下代碼：

var o = { 

  name : 'zxs'

  } 

var obj = o; 

o = {} 

console.log(o.name);  

此時輸出的值是undefined，因為，對象是一個引用類型，“=”是賦值操作符，并且其運算順序是從右往左。o={}就是說o的指向已經改變，是一個空對象。

Person.prototype.mothed = function() {}與Person.prototype={mothed:function(){}}的區別就如同 arr = []和arr.push()一樣，前者都是修改自身，后者是完全改變自身。