## 一、概述 JavaScript 語言中，生成實例對象的傳統方法是通過構造函數。 ``` function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')'; }; var p = new Point(1, 2); ``` ES6 提供了更接近傳統語言的寫法，引入了 Class（類）這個概念，作為對象的模板。通過`class`關鍵字，可以定義類。 ``` class Point { constructor(x, y) { this.x = x; this.y = y; } toString() { return '(' + this.x + ', ' + this.y + ')'; } } ``` ## 二、constructor `constructor`方法是類的默認方法，通過`new`命令生成對象實例時，自動調用該方法。一個類必須有`constructor`方法，如果沒有顯式定義，一個空的`constructor`方法會被默認添加。 ``` class Point { } // 等同于 class Point { constructor() {} } ``` ## 三、prototype 屬性和__proto__屬性 大多數瀏覽器的 ES5 實現之中，每一個對象都有__proto__屬性，指向對應的構造函數的prototype屬性。Class 作為構造函數的語法糖，同時有prototype屬性和__proto__屬性，因此同時存在兩條繼承鏈。 （1）子類的__proto__屬性，表示構造函數的繼承，總是指向父類。 （2）子類prototype屬性的__proto__屬性，表示方法的繼承，總是指向父類的prototype屬性。 ``` class A { } class B extends A { } B.__proto__ === A // true B.prototype.__proto__ === A.prototype // true ``` ``` class A { } class B { } // B 的實例繼承 A 的實例 Object.setPrototypeOf(B.prototype, A.prototype); // B 繼承 A 的靜態屬性 Object.setPrototypeOf(B, A); const b = new B(); ``` ## 四、extends繼承 Class 可以通過`extends`關鍵字實現繼承； ``` class Point { } class ColorPoint extends Point { } ``` ## 五、Object.getPrototypeOf Object.getPrototypeOf方法可以用來從子類上獲取父類。 ``` Object.getPrototypeOf(ColorPoint) === Point // true ``` ## 六、super super這個關鍵字，既可以當作函數使用，也可以當作對象使用。在這兩種情況下，它的用法完全不同。 第一種情況，super作為函數調用時，代表父類的構造函數。ES6 要求，子類的構造函數必須執行一次super函數。 ``` class A {} class B extends A { constructor() { super(); } } ``` 作為函數時，`super()`只能用在子類的構造函數之中，用在其他地方就會報錯。 ``` class A {} class B extends A { m() { super(); // 報錯 } } ```