[TOC] >[success] # Class類的理解和使用 **JavaScript** 中的 **Class 類** 是一種 **創建對象的方法** ，它 **通過定義類來描述對象的屬性和方法** ，并 **通過實例化類來創建具體的對象** 。以下是在 **JavaScript** 中使用 **Class 類** 的一些 **常見場景**： 1. **創建對象**：使用 **Class 類** 可以方便地 **創建對象** ，從而 **避免了使用傳統的函數或原型鏈方式創建對象的繁瑣**。 2. **繼承**：使用 **Class 類** 可以 **輕松實現面向對象編程中的繼承特性**，從而 **可以在子類中重用父類的屬性和方法，同時還能擴展自己的屬性和方法**。 3. **封裝**：使用 Class 類可以將屬性和方法封裝在類中，從而實現數據和行為的隔離，提高代碼的可維護性和安全性。 4. **實現接口**：使用 **Class 類** 可以實現 **接口**，從而使得對象在實現某些特定功能時遵循規范，并且可以方便地擴展和重用這些功能。 5. **實現單例模式** ：使用 **Class 類可以實現單例模式**，即 **保證某個類只存在一個實例對象，從而避免了多次創建相同對象的問題**。 6. **組織和管理代碼**：**類** 可以將 **<u>數據和方法組合在一起</u>** ，形成更加邏輯和語義上一致的結構，這可以使代碼更易于閱讀和維護，尤其在需要處理復雜業務邏輯的場景下，使用類可以更好地組織和管理代碼。 總之，使用 Class 類可以使代碼更加結構化、易讀、易維護，同時還可以提高代碼的可復用性和擴展性。 >[success] ## Class類（小白版本） 下面是一個 **基礎版本** 的 **Class 類** ，用于小白學習： ~~~ class MyClass { // 構造函數，用于創建實例并初始化實例屬性 constructor(name) { this.name = name; } // 實例方法 sayHello() { console.log(`Hello, ${this.name}!`); } // 靜態方法 static sayHi() { console.log('Hi!'); } } ~~~ 以上代碼定義了一個名為 **MyClass 的類**，包含了 **構造函數、實例方法和靜態方法**。 * **構造函數**：通過 **constructor 關鍵字定義**，用于 **創建實例對象** 并 **初始化實例屬性**。在這個例子中，構造函數接收一個 **參數 name**，用于初始化實例屬性 this.name。 * **實例方法**： **定義在類的原型對象上，用于操作實例屬性和方法**。在這個例子中，實例方法 sayHello() 用于打印一句問候語，使用實例屬性 this.name。 * **靜態方法**：**使用 static 關鍵字定義，可以在類級別上訪問和調用**。在這個例子中，靜態方法 sayHi() 用于打印一句問候語。 **使用這個類創建實例并調用方法** 的 **示例代碼**： ~~~ // 創建實例 const myObj = new MyClass('Jack'); // 調用實例方法 myObj.sayHello(); // 輸出 "Hello, Jack!" // 調用靜態方法（ 靜態方法不需要去new實例化，可以直接去調用） MyClass.sayHi(); // 輸出 "Hi!" ~~~ >[success] ## Class類（標準版本） 下面是一個包含 **常見 Class 相關知識點** 的示例代碼： ~~~ class MyClass { // 靜態屬性 static staticProperty = '靜態屬性'; // 構造函數 constructor(prop) { // 私有屬性 this.#privateProperty = prop; // 公共屬性 this.publicProperty = '公共屬性'; } // 私有屬性 #privateProperty; // 靜態方法 static staticMethod() { console.log('這是一個靜態方法'); } // 公共方法 publicMethod() { console.log('這是一個公共方法'); // 調用私有方法 this.#privateMethod(); } // 私有方法 #privateMethod() { console.log('這是一個私有方法'); } // Getter 方法 get privateProperty() { return this.#privateProperty; } // Setter 方法 set privateProperty(value) { this.#privateProperty = value; } // 公共靜態方法 static publicStaticMethod() { console.log('這是一個公共靜態方法'); } } // 調用靜態屬性和靜態方法 console.log(MyClass.staticProperty); // 輸出：靜態屬性 MyClass.staticMethod(); // 輸出：這是一個靜態方法 // 創建實例并調用公共方法和 Getter/Setter 方法 const myObj = new MyClass('私有屬性'); console.log(myObj.publicProperty); // 輸出：公共屬性 myObj.publicMethod(); // 輸出：這是一個公共方法，這是一個私有方法 console.log(myObj.privateProperty); // 輸出：私有屬性 myObj.privateProperty = '新的私有屬性'; console.log(myObj.privateProperty); // 輸出：新的私有屬性 // 調用公共靜態方法 MyClass.publicStaticMethod(); // 輸出：這是一個公共靜態方法 ~~~ 這個示例代碼展示了以下 Class 相關知識點： * 靜態屬性和靜態方法：通過 static 關鍵字聲明靜態屬性和靜態方法，并且可以通過類名直接訪問。 * 構造函數：使用 constructor 關鍵字定義構造函數，用于創建實例對象并初始化屬性。 * 私有屬性和方法：通過在屬性或方法名前面加上 # 符號定義私有屬性和方法，外部無法直接訪問和調用，只能在類內部使用。 * Getter 和 Setter 方法：使用 get 和 set 關鍵字定義 Getter 和 Setter 方法，用于控制類的屬性訪問和修改。 * 公共方法：定義在類中的公共方法可以被實例對象訪問和調用。 * 公共靜態方法：使用 static 關鍵字定義公共靜態方法，可以通過類名直接調用。 上面的代碼是Class類中所有的相關知識點嗎？ 這里列出的是 Class 類中常見的一些相關知識點，但并不是全部。Class 是 ECMAScript 6 中新增的語法特性，具有很強的靈活性，可以用于實現很多不同的場景。下面列出一些常見的 Class 類相關知識點，供參考： * 構造函數和實例化：使用 constructor 關鍵字定義構造函數，用于創建類的實例對象，并初始化實例屬性。 * 繼承和多態：使用 extends 關鍵字實現類的繼承，子類可以繼承父類的屬性和方法，并且可以覆蓋父類的方法實現多態。 * 靜態方法和屬性：使用 static 關鍵字定義靜態方法和屬性，可以在類級別上定義和訪問屬性和方法。 * 私有方法和屬性：使用 # 符號定義私有屬性和方法，只能在類內部訪問，外部無法訪問。 * Getter 和 Setter 方法：使用 get 和 set 關鍵字定義 Getter 和 Setter 方法，用于控制屬性的訪問和修改。 * 抽象類和接口：使用 abstract 關鍵字定義抽象類，接口可以定義一組規范，用于指導類的實現。 * Mixin：使用多個類的屬性和方法組合成一個新的類，用于代碼復用和組件化。 以上是一些常見的 Class 相關知識點，但不是全部，還有很多其他的用法和特性，具體需要根據實際場景選擇適合的用法。 >[success] ## Class類繼承 以下是 **Class繼承** 的代碼案例： ~~~ // 父類 class Animal { constructor(name) { this.name = name; } eat() { console.log(`${this.name} is eating.`); } } // 子類 class Dog extends Animal { constructor(name) { super(name); } bark() { console.log(`${this.name} is barking.`); } } // 使用子類 const myDog = new Dog('Tom'); myDog.eat(); // 輸出 "Tom is eating." myDog.bark(); // 輸出 "Tom is barking." ~~~ 以上代碼定義了一個名為 Animal 的父類和一個名為 Dog 的子類，Dog 類繼承了 Animal 類的屬性和方法。在這個例子中： * 父類 Animal：定義了一個構造函數和一個實例方法 eat()，用于創建 Animal 實例和讓 Animal 實例吃東西。 * 子類 Dog：使用 extends 關鍵字繼承了 Animal 類，并定義了一個構造函數和一個實例方法 bark()，用于創建 Dog 實例和讓 Dog 實例叫。 * 構造函數：在子類中，需要通過 super() 調用父類的構造函數并傳遞參數，以初始化繼承自父類的屬性。 * 繼承方法：子類中可以繼承父類的實例方法，這樣子類實例可以使用父類的方法。 * 新增方法：子類中可以定義新的實例方法，這樣子類實例可以使用子類獨有的方法。 使用這個繼承類的示例代碼： ~~~ // 創建實例 const myDog = new Dog('Tom'); // 調用父類方法 myDog.eat(); // 輸出 "Tom is eating." // 調用子類方法 myDog.bark(); // 輸出 "Tom is barking." ~~~