Javascript中建立對象的文法是在new運算子的後面跟著一個函數的調用。如
複製代碼 代碼如下:
var obj = new Object();
var date = new Date();
運算子new首先建立一個新的沒有任何屬性的對象，然後調用該函數，把新的對象作為this關鍵字的值傳遞。
複製代碼 代碼如下:
var date = new Date()的虛擬碼的實現就是
var obj = {};
var date = Date.call(obj);
建構函式的作用就是初始化一個新建立的對象，並在使用對象前設定對象的屬性。如果定義自己的建構函式，只需要編寫一個為this添加屬性的函數就可以了。下面的代碼定義了一個建構函式：
複製代碼 代碼如下:
function Rectangle(w, h)
{
this.width = w;
this.height = h;
}
然後，可以使用new運算子調用這個函數來建立對象的執行個體
複製代碼 代碼如下:
var rect = new Rectange(4,8);
建構函式的傳回值
Javascript中的建構函式通常沒有傳回值。但是，函數是允許有傳回值的。如果一個建構函式有一個傳回值，則返回的對象成為new運算式的值。在此情況下，作為this的對象將會被拋棄。
使用建構函式定義法
文法
複製代碼 代碼如下:
var object=new objectname();
var -- 聲明物件變數
object -- 對象的名稱
new -- new的關鍵詞(JavaScript關鍵詞)
objectname -- 建構函式名稱
樣本
複製代碼 代碼如下:
//定義建構函式
function Site(url, name)
{
this.url = "www.jb51.net";
this.name ="夢之都";
}
//使用建構函式產生一個JavaScript對象的執行個體
var mysite = new Site();
alert(mysite.url);
建構函式通常可以初始化對象中的一些內容，JavaScript內部提供的一些對象通常需要使用建構函式的方法產生。JavaScript函數的內容將在下一章介紹。
直接定義法建立JavaScript對象
複製代碼 代碼如下:
//定義對象文法
var object={};
//對象內的屬性文法(屬性名稱(property)與屬性值(value)是成對出現的)
object.property=value;
//對象內的函數文法(函數名(func)與函數內容是成對出現的)
object.func=function(){...;};
var -- 聲明物件變數
object -- 對象的名稱
property -- 對象的屬性名稱
func -- 對象的方法名
說明：對象可以包含一些屬性(函數可以看作帶有括弧的特殊屬性)，每個屬性有名稱和值。名稱可以是任何字串甚至是空。值可以是任何javascript類型，但不能是undefined。
使用定義法定義的對象樣本
複製代碼 代碼如下:
var site = {};
site.URL = "www.jb51.net";
site.name = "雲棲社區";
site.englishname = "jb51";
site.author = "指令碼";
site.summary = "免費的網頁設計教程";
site.pagescount = 100;
site.isOK = true;
site.startdate = new Date(2005, 12);
site.say = function(){alert(this.englishname+" say : hello world!")};
site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已經"+theage+"歲了!")}
使用建構函式建立JavaScript對象樣本 -- 可以嘗試編輯
使用建構函式建立JavaScript對象
上面的方法定義了一個site的對象，並且為其定義了七個屬性，與兩個個方法。
say方法會列印出jb51 say : hello world!的字串
age方法會計算出夢之都網站的年齡
猴子提示: 注意每個屬性與函數前面都要加上對象的名稱，否則JavaScript無法判斷它是屬於那個對象的。
下面的課程將講解直接定義法的延伸，JSON定義法。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>使用建構函式建立JavaScript對象 -- JavaScript教程</title> </head> <body> <p>建構函式法建立JavaScript對象</p> <script type="text/javascript"> //定義建構函式 function Site(url, name) { this.url = "www.jb51.net"; this.name ="雲棲社區"; } //使用建構函式產生一個JavaScript對象的執行個體 var mysite = new Site(); alert(mysite.url); </script> <p>直接法建立JavaScript對象</p> <script type="text/javascript"> var site = {}; site.URL = "www.jb51.net"; site.name = "雲棲社區"; site.englishname = "jb51"; site.author = "指令碼"; site.summary = "免費的網頁設計教程"; site.pagescount = 100; site.isOK = true; site.startdate = new Date(2005, 12); site.say = function(){alert(this.englishname+" say : hello world!")}; site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已經"+theage+"歲了!")} site.age(); </script> <div ><form method="post" action="#"><input type="button" name="dreamduinput" id="dreamduinput" value="----上面的內容就對應著下面的代碼,修改代碼,並點我,查看一下效果吧!----" onClick="RunCode(dreamdutest)"><textarea name="dreamdutest" id="dreamdutest" rows="20" cols="120"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>使用建構函式建立JavaScript對象</title> </head> <body> <script type="text/javascript"> //定義建構函式 function Site(url, name) { this.url = "www.jb51.net"; this.name ="夢之都"; } //使用建構函式產生一個JavaScript對象的執行個體 var mysite = new Site(); alert(mysite.url); </script> <p>直接法建立JavaScript對象</p> <script type="text/javascript"> var site = {}; site.URL = "www.jb51.net"; site.name = "夢之都"; site.englishname = "dreamdu"; site.author = "可愛的猴子"; site.summary = "免費的網頁設計教程"; site.pagescount = 100; site.isOK = true; site.startdate = new Date(2005, 12); site.say = function(){alert(this.englishname+" say : hello world!")}; site.age = function(){var theage=(new Date().getFullYear())-site.startdate.getFullYear();alert(this.name+"已經"+theage+"歲了!")} site.age(); </script> </body> </html></textarea></form></div> </body> </html>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
