物件

在 JavaScript 中，物件（Object）是一種重要的資料結構，用於存儲鍵值對（key-value pairs）。物件允許你將相關的資料和功能組織在一起，使你的代碼更加結構化和易於管理。下面將詳細說明 JavaScript 中物件的使用，包括如何創建、訪問、修改物件屬性，如何使用方法，如何遍歷物件，如何進行深淺拷貝，以及一些進階操作。

1. 創建物件

1.1 使用物件字面量

這是創建物件最常見的方法，通過花括號 {} 定義一組鍵值對。

let person = {
    name: "John",
    age: 30,
    isEmployed: true
};

1.2 使用 `Object` 構造函式

這種方法也可以用來創建物件，但通常使用物件字面量更簡潔。

let person = new Object();
person.name = "John";
person.age = 30;
person.isEmployed = true;

1.3 使用 `Object.create` 方法

Object.create 方法可以創建一個繼承自指定原型的物件。

let personPrototype = {
    greet() {
        console.log("Hello!");
    }
};

let person = Object.create(personPrototype);
person.name = "John";

2. 訪問和修改物件屬性

2.1 點記法

點記法是最常見的方式，通過 . 符號來訪問或修改物件的屬性。

console.log(person.name);  // 輸出 "John"

person.age = 31;
console.log(person.age);  // 輸出 31

2.2 方括號記法

方括號記法允許使用變量或包含空格、特殊字符的鍵來訪問屬性。

console.log(person["name"]);  // 輸出 "John"

let key = "age";
console.log(person[key]);  // 輸出 31

person["is Employed"] = false;
console.log(person["is Employed"]);  // 輸出 false

3. 添加和刪除屬性

3.1 添加屬性

你可以通過點記法或方括號記法來添加新的屬性。

person.job = "Developer";
console.log(person.job);  // 輸出 "Developer"

3.2 刪除屬性

使用 delete 運算符可以刪除物件中的屬性。

delete person.isEmployed;
console.log(person.isEmployed);  // 輸出 undefined

4. 方法（Methods）

物件的方法是作為物件屬性存在的函式。它們可以操作物件的資料，實現特定功能。

let person = {
    name: "John",
    age: 30,
    greet() {
        console.log("Hello, my name is " + this.name);
    }
};

person.greet();  // 輸出 "Hello, my name is John"

在這個例子中，greet 是 person 物件的方法，this 關鍵字指向呼叫該方法的物件（即 person 物件本身）。

5. 遍歷物件

5.1 `for...in` 迴圈

for...in 迴圈可以遍歷物件的所有可枚舉屬性。

for (let key in person) {
    console.log(key + ": " + person[key]);
}

// 輸出:
// name: John
// age: 30
// greet: function greet() { ... }

5.2 `Object.keys`

Object.keys 方法返回一個包含物件所有可枚舉屬性鍵的陣列。

let keys = Object.keys(person);
console.log(keys);  // 輸出 ["name", "age", "greet"]

5.3 `Object.values`

Object.values 方法返回一個包含物件所有可枚舉屬性值的陣列。

let values = Object.values(person);
console.log(values);  // 輸出 ["John", 30, function greet() { ... }]

5.4 `Object.entries`

Object.entries 方法返回一個包含物件所有可枚舉屬性鍵值對的二維陣列。

let entries = Object.entries(person);
console.log(entries);  // 輸出 [["name", "John"], ["age", 30], ["greet", function greet() { ... }]]

6. 物件的拷貝

6.1 淺拷貝

淺拷貝只複製物件的第一層屬性，如果屬性值是物件或陣列，它們仍然共享相同的記憶體引用。

let personCopy = Object.assign({}, person);
personCopy.name = "Jane";
console.log(person.name);  // 輸出 "John"
console.log(personCopy.name);  // 輸出 "Jane"

另一種淺拷貝的方法是使用展開運算符 ...。

let personCopy = { ...person };

6.2 深拷貝

深拷貝會遞歸地複製物件的所有層級，這樣修改拷貝後的物件不會影響原始物件。

深拷貝可以通過 JSON.parse(JSON.stringify()) 方法來實現，但它有一些局限性，比如不能拷貝函式。

let personDeepCopy = JSON.parse(JSON.stringify(person));

如果物件中包含函式或其他特殊類型的值，你可能需要使用專門的深拷貝工具庫（如 lodash 的 _.cloneDeep 方法）。

7. 物件合併

7.1 `Object.assign` 合併物件

Object.assign 方法將一個或多個來源物件的屬性拷貝到目標物件中。

let additionalInfo = { job: "Developer", city: "New York" };
let mergedPerson = Object.assign({}, person, additionalInfo);
console.log(mergedPerson);
// 輸出 {name: "John", age: 30, greet: function, job: "Developer", city: "New York"}

7.2 使用展開運算符合併物件

展開運算符 ... 也可以用來合併物件，語法更簡潔。

let mergedPerson = { ...person, ...additionalInfo };

8. 物件的原型繼承

JavaScript 是基於原型的語言，每個物件都有一個內部的 [[Prototype]] 屬性，可以指向另一個物件。你可以使用 Object.create 來創建一個新物件，並指定其原型。

let animal = {
    eats: true,
    walk() {
        console.log("Animal is walking");
    }
};

let rabbit = Object.create(animal);
rabbit.jumps = true;

console.log(rabbit.eats);  // 輸出 true (從原型繼承)
rabbit.walk();  // 輸出 "Animal is walking"

9. 檢查物件屬性

9.1 `in` 運算符

in 運算符用於檢查物件是否包含某個屬性，無論該屬性是否來自原型鏈。

console.log("name" in person);  // 輸出 true
console.log("toString" in person);  // 輸出 true (從 Object.prototype 繼承)

9.2 `hasOwnProperty` 方法

hasOwnProperty 方法只會檢查物件自身的屬性，而不包括從原型鏈繼承的屬性。

console.log(person.hasOwnProperty("name"));  // 輸出 true
console.log(person.hasOwnProperty("toString"));  // 輸出 false

總結

JavaScript 中的物件是一種靈活且強大的資料結構，理解並掌握物件的操作和使用方法對於編寫結構化、可維護的代碼至關重要。物件不僅用於存儲複雜的資料，還可以與方法結合，模擬類和繼承等進階概念。

物件