ECMAScript 6引入了class關(guān)鍵字以創(chuàng)建JavaScript中的類。現(xiàn)在，你可以使用class屬性在JavaScript中創(chuàng)建類。在ECMA 6之前，無論何時使用new運算符調(diào)用一個函數(shù)，該函數(shù)都會返回一個新對象。因此，此函數(shù)是作為一個類來使用的，并被稱為構(gòu)造函數(shù)。這種調(diào)用函數(shù)來返回對象的方式也被稱為構(gòu)造函數(shù)調(diào)用模式。
但在ECMAScript 6中，可以使用class關(guān)鍵字創(chuàng)建類。請看下面的代碼：
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
}
在上面的代碼片段中，你已經(jīng)使用ECMAScript 6 class關(guān)鍵字創(chuàng)建了一個名為Car的類。你也可以創(chuàng)建一個Car類的對象，如下所示：
var car1 = new Car("BMW", 100);
car1.getInfo();
var car2 = new Car("Audi", 150);
car2.getInfo();
JavaScript類是慣?；谠偷睦^承的簡化語法。它不提供任何新的對象創(chuàng)建或原型繼承方式，并且不會在JavaScript中引入任何面向?qū)ο蠡蚶^承的新模型。你也可以說類是創(chuàng)建對象的特殊函數(shù)。
類聲明和表達
由于JavaScript中的class屬性也是一個函數(shù)，所以也可以使用類聲明和類表達式來創(chuàng)建。你可以使用類聲明創(chuàng)建一個類，如下所示：
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
}
類也可以使用類表達式來創(chuàng)建。你可以創(chuàng)建命名或未命名的類表達式?？梢赃@樣創(chuàng)建命名的類表達式，如下所示：
var Car = class {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
toString() {
return `${this.maker} costs : ${this.price}`;
}
}
未命名的類表達式可以如下所示地被創(chuàng)建。給類表達式的名稱是類主體的本地名稱。
var Car = class c {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
toString() {
return `${this.maker} costs : ${this.price}`;
}
}
類的提升
如前所述，一個類既可以作為聲明又可以作為表達式來創(chuàng)建，但是與函數(shù)聲明不同，類聲明不會被提升到執(zhí)行上下文的頂部。請看下面的代碼：
var car1 = new Car("BMW", 10); // Reference Error console.log(car1.toString());
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
toString() {
return `${this.maker} costs : ${this.price}`;
}
}
上面的代碼會拋出引用錯誤（Reference Error），因為你在聲明它之前試圖訪問一個類。因此，我們可以得到函數(shù)聲明被提升，而類聲明不被提升的結(jié)論。
類方法
JavaScript類中有三種類型的方法：
- 構(gòu)造方法。
- 靜態(tài)方法。
- 原型方法。
類構(gòu)造函數(shù)方法創(chuàng)建初始化對象。一個類只能有一個構(gòu)造方法。如果你嘗試創(chuàng)建多個構(gòu)造函數(shù)方法，則JavaScript將引發(fā)異常?？梢允褂藐P(guān)鍵字constructor 創(chuàng)建構(gòu)造函數(shù)，如下面的代碼所示：
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
}
JavaScript類的靜態(tài)方法是用類調(diào)用的，而不是用類的特定對象調(diào)用的。如果你嘗試用類的實例調(diào)用它們，則JavaScript將拋出異常。使用關(guān)鍵字static可以創(chuàng)建靜態(tài)方法，如下所示：
class Car {
static count() {
console.log("I am static method");
}
}
Car.count();
Car.count();
如果你試圖用實例調(diào)用靜態(tài)方法，那么JavaScript會拋出異常說明這個函數(shù)不存在。另外，請記住，JavaScript類沒有靜態(tài)屬性或成員。截至目前，它只支持靜態(tài)方法。
任何使用類實例訪問的常規(guī)方法都被稱為原型方法。這些方法可以繼承和使用類的對象。
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
}
var car1 = new Car("BMW", 10);
car1.getInfo();
在上面的代碼片段中，getInfo()是Car類的原型方法。正如你所看到的，我們正在使用Car類的實例。由于它是原型方法，所以也可以繼承。讓我們來探討為什么這些方法被稱為原型方法。首先，考慮下面的代碼：
class Car {
constructor(maker, price) {
this.maker = maker;
this.price = price;
}
getInfo() {
console.log(this.maker + " costs : " + this.price);
}
}
console.log(typeof (Car)); // function
在這個代碼片段中，我們輸入了一個Car類的類型，也得到了一個函數(shù)的輸出。正如你所看到的，這個類只是一個函數(shù)類型，所以和其他函數(shù)一樣，它也有一個prototype屬性。這些常規(guī)的方法是類的原型對象的方法，因此它們被稱為原型方法。它們可以通過堅持基于原型的繼承而被繼承。
除了這三種類型的方法之外，JavaScript也有一些叫g(shù)etter和setter的東西，你可以點此處了解。
結(jié)論
在這篇文章中，我們簡要介紹了ECMAScript 2015中引入的JavaScript類屬性。使用class關(guān)鍵字，我們可以創(chuàng)建一個類，但是請記住，這不是引入對象創(chuàng)建或繼承的新方法。相反，對于相同的對象和基于原型的繼承，這只是一個更簡單的語法。
