在軟體系統中，物件（Objects） 是 物件導向程式設計（OOP） 的核心，而今天就要來談談 JavaScript 中關於物件的基礎概念。物件（Objects） 是一種資料結構，它的內部包含 屬性（Properties） 和方法（Methods），簡單來說就是用來儲存資料的容器。在這篇文章中將先探討 JavaScript 中的物件基本結構和一些物件相關的操作。

物件的基本結構

在 JavaScript 中，物件是一個由鍵值對（Key-Value Pairs）組成的集合。每個鍵（Key）是一個字串，與一個值（Value）相關聯。這些值可以是原始資料型別（數字、字串、布林值等），也可以是物件型別（物件、陣列、函式等），而這些裡面的內容稱之為 屬性（Properties） 和 方法（Methods）。

以下是一個物件的範例，它具有名稱、年齡、是否成年的「屬性」，還有一個 greet 的「方法」。

{
    name: "John",
    age: 30,
    isAdult: true,
    greet: function() {
        console.log(`Hello, my name is ${this.name}.`);
    }
}

建立新物件的方式

要建立新物件，有兩種常見的方式：

1. 物件實值（Object Literals）

這種方式是簡單且常見的建立物件的方式。

conet person = {
    name: "Alice",
    age: 25
};

2. 透過建構式的方式，（Constructor）

使用 new 關鍵字建立空物件，並透過建構式來建立屬性或方法。
這種方式適合需要建立多個相同結構物件的情況。

function Person(value) {
    // 透過建構式的方式，這裡的 this 會指向 new 關鍵字建立的空物件，並賦值到 name 屬性上
    this.name = value; 
}

console.log(new Person('Bob')); // 輸出 Person {name: 'Bob'}
console.log(new Person('Eva')); // 輸出 Person {name: 'Eva'}

物件的基本操作

存取屬性值

可以使用點運算子 . 或中括號 [] 來訪問物件的屬性值。

const person = {
    name: 'John',
    age: 30,
    greet: function() {
        console.log(`Hello, my name is ${this.name}.`);
    }
};

console.log(person.age); // 使用點運算子，輸出：30
console.log(person['age']); // 使用中括號，輸出：30

person.greet(); // 透過點運算子呼叫方法
person['greet'](); // 透過中括號呼叫方法

新增或修改屬性

可以使用點運算子 . 或中括號 [] 來新增或修改物件的屬性值。

const person = {
    name: 'John',
    age: 30
};

person.name = 'Jane'; // 透過點運算子修改屬性值
console.log(person.name); // 輸出 'Jane'

person['name'] = 'July'; // 透過中括號修改屬性值
console.log(person.name); // 輸出 'July'

console.log(person.job); // 輸出 undefined
person.job = 'Developer'; // 新增屬性
console.log(person.job); // 輸出 'Developer'

• 刪除屬性

const person = {
    name: 'John',
    age: 30
};

console.log(person.age); // 輸出 30
delete person.age; // 刪除屬性
console.log(person.age); // 輸出 undefined

結語

JavaScript 中的物件可說是無所不在的，理解物件結構和基本操作是開發者的必備技能之一。今天只介紹了最原始的 Object，但它只是一切的基礎，實際上還有更複雜的資料結構，像常見的陣列、函式等其實都是物件的一種。這些就留到下次講吧，那麼今天就到這邊，我們明天見~