理解JavaScript中的對象 推薦

在JavaScript沒有類的定義，建立對象時沒有固定的模板，可以動態建立新的屬性和方法，在動態建立新屬性的時候，我們能做的就是為這個屬性建立新的值，下面一個例子就是建立一個對象並增加x,y兩個屬性。 複製代碼 代碼如下:var Programmer = new Object();
Programmer.name = "Young";
Programmer.age = 25;
alert(Programmer.name + " : " + Programmer.age);

JavaScript對象完全不同於c#或vb對象，JavaScript對象可以看成一組健/值對的集合，用對象.屬性名稱來訪問一個對象屬性。我們可以把JavaScript對象看成.NET framework中Dictionary類，我們可以通過"[]"操作符來建立對象屬性。 複製代碼 代碼如下:var Programmer = new Object();
Programmer["name"] = "Young";
Programmer["age"]= 25;
document.getElementById("message").innerHTML=Programmer["name"] + " : " + Programmer["age"];
alert(Programmer.name + " : " + Programmer.age); 通過上面的例子可以發現兩種訪問對象的方法是一樣的。如果一個屬性沒有建立，將返回"undefined"。

我們同樣可以將函數添加為健/值對集合的值，這樣就構建為對象的方法， 複製代碼 代碼如下:var Programmer = new Object();
Programmer["name"] = "Young";
Programmer.age= 25;
Programmer.speak=function(){
alert(this.name + " : " + this["age"]);
}
Programmer.speak();

在上面的代碼中我們交替使用"."和"[]"來定義可訪問屬性、方法，者=這兩種方法的一樣的，有時這些操作符會導致一些概念上的混淆，在為一個已經存在的屬性設定新值是表達的不是很清晰，下面我們介紹第三種文法可以更加明確的表達我們的意圖。 複製代碼 代碼如下:var Programmer =
{
name : "Young",
age : 25,
speak : function(){ alert(this.name + " : " + this.age); }
}
Programmer.speak(); 上面的代碼更加清晰的表達了對象初始化的開始和結束，我們還可以用這種方法在獨享中嵌套對象。 var Programmer =
{
Figure : {name : "Young" , age : 25 },
Company : {name : " Arcadia" , address : "ShenZheng"},
speak : function(){
alert("name:"+this.Figure.name+"\nage:"+this.Figure.age + "\nCompany:"+this.Company.name+" of

"+this.Company.address);
}
};
Programmer.speak();

這種文法因為其清晰的意圖和緊湊的代碼格局而非常流行，你可以在各種流行的JavaScript frameworks中看到，包括目前在互連網上流行的JavaScript Object Notation（JSON），JSON是一種輕量級的資料交換格式，同時也易於機器解析和產生，文法也非常嚴格。JSON允許JavaScript在互連網上交換資料，我們可以用eval將JSON對象轉化為本地JavaScript對象。 複製代碼 代碼如下:var Programmer="({name: 'Young',age : 25})";
var p = eval(Programmer);
alert(p.name + ',' + p.age);

通過上面的討論我們知道了明白了所有的JavaScript對象都是一組字典。在JavaScript中還有另外一個重要的東西——函數。
1：在JavaScript中，函數都是一個對象。這一點完全不同於c#中的方法。我們看下面一個例子。 複製代碼 代碼如下:function add(point1, point2)
{
var result = {
x : point1.x + point2.x,
y : point1.y + point2.y
}
return result;
}
var p1 = { x: 1, y: 1 };
var p2 = { x: 2, y: 2 };
var p3 = add(p1, p2);
alert(p3.x + "," + p3.y);2：將函數作為對象的方法。 var Boy=
{
name:"Young",
Love:function(Girl){
return this.name+" 愛上了 "+Girl.name
}
}
var Girl={
name:"Jing"
}
alert(Boy.Love(Girl));

現在問題是兩個類似的對象，一個有love方法，一個沒有，因為我們並沒有定義類似c#的類，而只是簡單的建立兩個對象，如果你期望在兩個對象都有love方法可以象下面那樣定義。 複製代碼 代碼如下:function LoveRelation(person){
alert(this.name+" 愛上了 "+person.name);
}
var person1={
name:"Young",
Love:LoveRelation
}
var person2={
name:"Jing",
Love:LoveRelation
}
person1.Love(person2);

上面的代碼看上去想建立一個person類，然後建立person類兩個執行個體，以使這兩個執行個體具有相同的特徵，顯然上面代碼不夠。我們可以通過兩種途徑來滿足這種要求。
途徑1： 複製代碼 代碼如下:function Person(n)
{
this.name=n;
this.Love=function(person)
{
alert(this.name+" 愛上了 "+person.name);
}
}
var person1=new Person("Young");
var person2=new Person("Jing");
person1.Love(person2);

途徑2：利用JavaSctipt對象的prototype屬性。 複製代碼 代碼如下:function Person(n)
{
this.name=n;
}
Person.prototype.Love=function(person)
{
alert(this.name+" 愛上了 "+person.name);
}
var person1=new Person("Young");
var person2=new Person("Jing");
person1.Love(person2);
person2.Love(person1);

上面的例子中，我們可以將Person函數看成Person對象的構造器，而所有通過此構造器構造出來的對象共用一個prototype屬性。
在Douglas Crockford的<a href="http://www.crockford.com/javascript/private.html">Private Members In JavaScript"</a>中，作者為我們詳細的示範了如何建立對象的私人成員，其思想不再詳細講解，我們簡單的重寫一下那個 demo 複製代碼 代碼如下:function Point(x, y)
{
this.get_x = function() { return x; }
this.set_x = function(value) { x = value; }
this.get_y = function() { return y; }
this.set_y = function(value) { y = value; }
}

Point.prototype.print = function()
{
return this.get_x() + ',' + this.get_y();
}

var p = new Point(2,2);
p.set_x(4);
alert(p.print());

最後我們講解一下javascript對象的命名空間，命名空間可以削除一些同名類型間的衝突，學習過c#的朋友對這點一定非常清除了，我們可以在javascript中通過以下代碼開定義命名空間。 var Arcadia = {} 複製代碼 代碼如下:Arcadia.Person=function(n)
{
this.name=n;
}
Arcadia.Person.prototype.Love=function(person)
{
alert(this.name+" 愛上了 "+person.name);
}
var person1=new Arcadia.Person("Young");
var person2=new Arcadia.Person("Jing");
person1.Love(person2);