ES6引入的class類,讓JAVAScript具有更加接近面向?qū)ο缶幊痰膶懛ā?/p>
ES6之前,想要生成一個實例,只能通過new關(guān)鍵字來調(diào)用構(gòu)造函數(shù)來完成。
ES6 使用class來定義類,在類的constructor構(gòu)造函數(shù)中定義實例的屬性。原型屬性直接在class內(nèi)部定義并且賦值,類的原型函數(shù)的聲明,是和constructor構(gòu)造函數(shù)屬于同一個層級,并且省略了function關(guān)鍵字。比如:
class Person{
// 原型屬性
publicName = "duxin";
constructor(name,age){
//實例屬性
this.name = name;
this.age = age;
}
//原型函數(shù)
getName(){
return this.name;
}
}
// 通過class創(chuàng)建實例
const child = new Person("duxinyues",18);
console.log(child.getName()); // duxinyues
在ES5中的寫法為:
//構(gòu)造函數(shù)
function Person(name,age){
//實例屬性
this.name = name;
this.age = age;
}
Person.prototype.publicName = "duxin";
Person.prototype.getName = function(){
return this.name
}
class中有構(gòu)造函數(shù)、靜態(tài)屬性和函數(shù):
constructor構(gòu)造函數(shù)
constructor構(gòu)造函數(shù),是class類中必須有的一個函數(shù),如果沒有手動添加,class也會自動加上一個空的構(gòu)造函數(shù)。
構(gòu)造函數(shù)默認返回對象的實例,也就是默認了this的指向。也可以手動修改構(gòu)造函數(shù)的返回值。
靜態(tài)屬性和函數(shù)
如果使用static關(guān)鍵字來修飾靜態(tài)屬性的話,那么實例就不能訪問該屬性,這個屬性只能通過類自身來訪問。比如:
class Foo {
static name = "duxin";
static getName() {
return this.name
}
}
console.log(Foo.getName()); //duxin
靜態(tài)函數(shù)中的this指向是類本身
Class繼承
ES6新增的extends關(guān)鍵字,可以快速實現(xiàn)類的繼承。
在子類的constructor構(gòu)造函數(shù)中,使用super函數(shù)來執(zhí)行父類的構(gòu)造函數(shù),然后再來執(zhí)行子類。比如:
class Parson {
constructor() {
this.name = "duxin"
}
}
class Child extends Parson {
constructor() {
super();
this.age = "908"
}
}
const child = new Child()
console.log(child.name); // duxin
這就是ES6中class的使用。