中級 Pro ⏱ 25:00
13-3 (付費) 封裝之極：私有成員與 Mixins
(Pro) 建立真正安全的類別。掌握 ES2026 私有欄位 (#)、靜態屬性，以及進階的 Mixins 模式來構建複雜系統。
13-3 (付費) 封裝之極：私有成員與 Mixins
👋 **老師的話 (Script)**:
"好的封裝，是要把對外不需要知道的秘密藏起來。
以往 JS 開發者只能用 `_` 代表私有（但其實外面還是看得到）。
在 2026 年，我們終於有了真正的私有欄位。 同時，我們也會處理一個常見難題：JS 不支援多重繼承。 如果一個類別想同時擁有『跑步』和『游泳』的能力該怎麼辦？答案就是 Mixins。“
1. 真正的私有欄位 (#)
在變數名稱前加上 #，它就變成真正的私有，外部存取會報錯。
class BankAccount {
#balance = 0; // 私有屬性
deposit(amount) {
this.#balance += amount;
}
getBalance() {
return this.#balance;
}
}
const account = new BankAccount();
account.deposit(100);
console.log(account.#balance); // ❌ 語法報錯！2. 靜態屬性與方法 (Static)
不需要實例化就能呼叫，通常用於工具函式。
class Utils {
static version = "1.0.0";
static formatDate() { ... }
}
console.log(Utils.version); // ✅ 直接叫3. Mixins (混入) 模式
由於 JS 只能 extends 一個父類別，我們可以用函數回傳類別的方式來實現 Mixins。
const swimmerMixin = (Base) => class extends Base {
swim() { console.log("我在游泳..."); }
};
const flyerMixin = (Base) => class extends Base {
fly() { console.log("我在飛翔..."); }
};
class Creature {}
class Duck extends flyerMixin(swimmerMixin(Creature)) {}
const duck = new Duck();
duck.swim();
duck.fly();
🧪 Lab 33: 權限管家 Mixin
建立一個
withPermissions 的 Mixin，
給目標類別新增一個 canEdit 屬性和 checkAuth() 方法。