JavaScript 物件
在本教程中，你將學習如何在 JavaScript 中建立和使用物件。
什麼是物件？
JavaScript 是一種基於物件的語言，在 JavaScript 中，幾乎所有東西都是一個物件，或者就像一個物件。因此，要有效地使用 JavaScript，我們需要了解物件的工作方式以及如何建立自己的物件並使用它們。
JavaScript 物件只是命名值的集合。這些命名值通常稱為物件的屬性。如果你還記得 JavaScript 陣列章節，則陣列是值的集合，其中每個值都有一個索引（數字鍵），從零開始，每個值遞增 1。物件類似於陣列，但區別在於你自己定義鍵，例如名稱、年齡、性別等。在以下部分中，我們將詳細瞭解物件。
建立物件
可以使用帶有可選屬性列表的大括號 {} 建立物件。屬性是 鍵：值 對，其中鍵（或屬性名稱）始終是字串，值（或屬性值）可以是任何資料型別，如字串、數字、布林值或複雜資料型別（如陣列）、函式和其他物件。此外，將函式作為其值的屬性通常稱為方法，以將它們與其他屬性區分開來。典型的 JavaScript 物件可能如下所示：
var person = {
name: "Peter",
age: 28,
gender: "Male",
displayName: function() {
alert(this.name);
}
};
上面的例子中建立名為 person 的物件，其具有三個屬性 name ， age 以及 gender 和一個方法 displayName() 。該 displayName() 方法顯示 this.name 解析為 person.name 的值。這是在 JavaScript 中建立新物件的最簡單且首選的方法，稱為物件文字語法。
屬性名稱通常不需要引用，除非它們是保留字，或者它們包含空格或特殊字元（除字母，數字 _ 和 $ 字元之外的任何字元），或者如果它們以數字開頭，如以下示例：
var person = {
"first name": "Peter",
"current age": 28,
gender: "Male"
};
注意： 從 ECMAScript 5 開始，保留字可以作為物件的屬性名而不用引用。但是，你應該避免這樣做以獲得更好的相容性。
訪問物件的屬性
要訪問或獲取屬性的值，可以使用點（.）或方括號（[]）表示法，如以下示例所示：
var book = {
"name": "Harry Potter and the Goblet of Fire",
"author": "J. K. Rowling",
"year": 2000
};
// Dot notation
document.write(book.author); // Prints: J. K. Rowling
// Bracket notation
document.write(book["year"]); // Prints: 2000
點符號更易於讀寫，但不能始終使用。如果屬性的名稱無效（即如果它包含空格或特殊字元），則不能使用點表示法; 你必須使用括號表示法，如下例所示：
var book = {
name: "Harry Potter and the Goblet of Fire",
author: "J. K. Rowling",
"publication date": "8 July 2000"
};
// Bracket notation
document.write(book["publication date"]); // Prints: 8 July 2000
方括號表示法比點符號提供了更多的靈活性。它還允許你將屬性名稱指定為變數而不僅僅是字串文字，如下例所示：
var person = {
name: "Peter",
age: 28,
gender: "Male"
};
var key = prompt("Enter any property name to get its value");
alert(person[key]); // Outputs: Peter (if enter "name")
迴圈物件的屬性
你可以使用 for...in 迴圈遍歷物件的鍵值對。此迴圈專門針對迭代物件的屬性進行了優化。這是一個例子：
var person = {
name: "Peter",
age: 28,
gender: "Male"
};
// Iterating over object properties
for(var i in person) {
document.write(person[i] + "<br>"); // Prints: name, age and gender
}
設定物件的屬性
同樣，你可以使用點（.）或括號（[]）表示法設定新屬性或更新現有屬性，如以下示例所示：
var person = {
name: "Peter",
age: 28,
gender: "Male"
};
// Setting a new property
person.country = "United States";
document.write(person.country); // Prints: United States
person["email"] = "peterparker@mail.com";
document.write(person.email); // Prints: peterparker@mail.com
// Updating existing property
person.age = 30;
document.write(person.age); // Prints: 30
person["name"] = "Peter Parker";
document.write(person.name); // Prints: Peter Parker
刪除物件的屬性
delete 運算子可以被用來從一個物件中完全刪除屬性。刪除是從物件中實際刪除屬性的唯一方法。將屬性設定為 undefined 或 null 僅更改屬性的值。它不會從物件中刪除屬性。
var person = {
name: "Peter",
age: 28,
gender: "Male",
displayName: function() {
alert(this.name);
}
};
// Deleting property
delete person.age;
alert(person.age); // Outputs: undefined
注意： delete 運算子僅刪除一個物件的屬性或陣列元素。它對變數或宣告的函式沒有影響。但是，你應該避免使用 delete 操作符來刪除陣列元素，因為它不會更改陣列的長度，只會在陣列中留下一個洞。
呼叫物件的方法
你可以像訪問屬性一樣訪問物件的方法 - 使用點表示法或使用方括號表示法。這是一個例子：
var person = {
name: "Peter",
age: 28,
gender: "Male",
displayName: function() {
alert(this.name);
}
};
person.displayName(); // Outputs: Peter
person["displayName"](); // Outputs: Peter
對數值和引用操作的區別
JavaScript 物件是引用型別，意味著當你複製它們時，你實際上只是複製對該物件的引用。而字串和數字等原始值則作為整體值分配或複製。為了更好地理解這一切，讓我們看看以下示例：
var message = "Hello World!";
var greet = message; // Assign message variable to a new variable
greet = "Hi, there!";
document.write(message); // Prints: Hello World!
document.write(greet); // Prints: Hi, there!
在上面的例子中，我們製作了一個變數的副本 message 並更改了該副本的值（即變數 greet）。這兩個變數保持不同和獨立。但是，如果我們對一個物件做同樣的事情，我們將得到一個不同的結果，如下例所示：
var person = {
name: "Peter",
age: 28,
gender: "Male"
};
var user = person; // Assign person variable to a new variable
user.name = "Harry";
document.write(person.name); // Prints: Harry
document.write(user.name); // Prints: Harry
你可以清楚地看到，對 user 變數所做的任何更改也會更改 person 變數; 它發生是因為兩個變數都引用同一個物件。因此，簡單地複製物件實際上並不克隆它，而是複製對該物件的引用。