# classes ## 在ES6中聲明一個class 在ES6中，你可以使用如下的方式進行Class聲明。**在使用的過程中，有一點需要特別注意，一定要先使用下面的任何一種方式聲明的class，才能引用class定義。**這個和原先的JavaScript prototype方式聲明有很大的區別，在原先的方式中，因為class是通過function來聲明的，而在javascript中，function將自動變成全局可見，所以class的定義可以出現在引用之后。 在后面的文章中，為了保持代碼的一致性和文章的清晰，我們將只適用第一種方式進行class定義 * 使用class關鍵字 ```javascript class Polygon{ } ``` *使用class表達式進行聲明 ```javascript var Polygon = class { } ``` ## 定義class的構造函數 通過使用constructor關鍵字，你可以給class定義一個構造函數。不過在整個class的定義中，只能有一個構造函數存在.下面是一個具體的例子 ```javascript class Polygon{ constructor(height, width){ this.height = height; this.width = width; } } ``` ## 給class增加成員屬性 在ES6中， 你可以通過getter和setter方法，給類增加屬性。如果屬性只有getter方法，那么它就是一個只讀屬性；如果屬性同時又setter和getter方法，那么它就是一個可讀寫屬性。請看下面的例子 **注意屬性`name`和`_name`** 因為我們定義了 name 的讀寫器，而沒有定義 _name 的讀寫器，所以訪問這兩個屬性的結果是不同的。 ```javascript class Person{ constructor(name){ this._name = name; } get name(){ return this._name.toUpperCase(); } /** * 注意一點，不要這樣寫: * set name(somename) { * this.name = somename; * } * 因為給 this.name 賦值的時候會調用 set name ，這樣會導致無限遞歸直到棧溢出。 * */ set name(somename){ this._name = somename; } } ``` ## 給class增加成員函數 這點沒什么可說的，就是在類定義中增加函數定義即可，請看下面的例 ```javascript class Polygon{ constructor(height, width){ this.height = height; this.width = width; } get name(){ return this._name; } set name(somename){ this._name = somename; } //readonly property get area(){ return calcArea(); } calcArea(){ return this.height * this.width; } } ``` ## 實現class的繼承 在ES6中，通過使用extends關鍵字，你可以使用類的繼承 ```javascript class Animal{ constructor(name){ this.name = name; } say(){ console.log(this.name + " try to say something..."); } } class Dog extends Animal{ say(){ //可以通過super關鍵字來調用父類的方法 super.say(); console.log(this.name + " barking..."); } } ``` ## 靜態成員函數 在ES6中，你可以使用static關鍵字來定義靜態成員函數。靜態成員函數的功能主要是對外提供一些輔助方法。在下面的例子中，Point類就向外提供了一個輔助方法來計算2點間的距離 ```javascript class Point(){ constructor(x, y){ this.x = x; this.y = y; } static distance(a, b){ constant dx = a.x - b.x; constant dy = a.y - b.y; return Math.sqrt(dx * dx + dy * dy); } } ```