一、物件基礎
在 JavaScript 中,物件是由鍵值對(key-value pairs)組成的結構。每個鍵值對都包含一個鍵(key)和對應的值(value),這些值可以是基本型別(primitive types)或其他物件。
下面是一個簡單的 JavaScript 物件的範例:
const person = {
name: 'John',
age: 30,
address: {
city: 'Taipei',
country: 'Taiwan'
}
};
console.log(person.name); // 輸出:John
console.log(person.age); // 輸出:30
console.log(person.address.city); // 輸出:Taipei
在上面的範例中,我們建立了一個名為 person
的物件,它包含了 name
、age
和 address
這三個鍵,分別對應到相應的值。
除了使用直接指定鍵值對的方式來建立物件外,我們還可以使用建構函式(constructor)和 new
關鍵字來建立物件。這種方式更適合用於創建多個相似物件的情況。
function Person(name, age) {
this.name = name;
this.age = age;
}
const person1 = new Person('John', 30);
const person2 = new Person('Jane', 25);
console.log(person1.name); // 輸出:John
console.log(person2.name); // 輸出:Jane
在上面的範例中,我們定義了一個 Person
的建構函式,並使用 new
關鍵字來創建兩個不同的 Person
物件。
二、類別基礎
在 ECMAScript 2015 (ES6) 的版本中,JavaScript 引入了類別(class)的概念,它提供了一種更簡潔、更具可讀性的方式來定義物件。類別可以視為物件的藍圖,它定義了物件的屬性和方法。
下面是一個使用類別定義物件的範例:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name}.`);
}
}
const person = new Person('John', 30);
person.sayHello(); // 輸出:Hello, my name is John.
在上面的範例中,我們使用 class
關鍵字定義了一個 Person
類別,並在類別內部定義了建構函式 constructor
和 sayHello
方法。使用 new
關鍵字來創建 Person
物件後,我們可以呼叫 sayHello
方法來輸出一段問候語。
除了建構函式和方法之外,類別還支援靜態方法(static methods)和繼承(inheritance)等功能。靜態方法是屬於類別本身而不是類別的實例的方法,而繼承則可以讓一個類別繼承另一個類別的屬性和方法。
三、物件和類別的關係
在 JavaScript 中,物件和類別是密切相關的。物件是由類別創建的實例,而類別則是物件的藍圖。我們可以使用 instanceof
運算子來檢查一個物件是否是某個類別的實例。
下面是一個示例:
class Person {
constructor(name) {
this.name = name;
}
}
const person = new Person('John');
console.log(person instanceof Person); // 輸出:true
console.log(person instanceof Object); // 輸出:true
在上面的範例中,我們創建了一個 Person
物件的實例 person
。通過使用 instanceof
運算子,我們可以確定 person
是 Person
類別的實例,同時也是 Object
類別的實例,因為所有的物件都繼承自 Object
。
結論
在本文中,我們深入探討了 JavaScript 中物件和類別的基礎知識。物件是由鍵值對組成的結構,可以使用直接指定鍵值對的方式或建構函式來創建物件。類別是物件的藍圖,提供了一種更簡潔、更具可讀性的方式來定義物件。我們還介紹了類別的建構函式、方法、靜態方法和繼承等相關概念。了解 JavaScript 中的物件和類別對於開發高效且可維護的程式碼至關重要,希望本文對於讀者更好地理解 JavaScript 中的物件和類別有所幫助。