ES6之Class類

1、Class的基本語法

一、簡介

---

 

基本上，ES6的class能夠看做只是一個 語法糖，它的絕大部分功能，ES5均可以作到，新的class寫法只是讓 對象原型 的寫法更加清晰、更像面向對象編程的語法而已。

若是要生成一個對象實例，須要先定義一個構造函數，而後經過new操做符來完成。構造函數實例：

//函數名和實例化構造名相同而且大寫（有助於區分構造函數和普通函數）

function Person(name,age){ this.name = name; this.age = age; } Person.prototype.read = function(){ return "個人名字叫" + "this.name" + "今年" + this.age + "歲了"; } var obj = new Person("一諾"，18);//經過構造函數建立對象，使用new
console.log(obj.read()) //結果：個人名字叫一諾今年18歲了。

 

上面代碼的代碼用ES6改寫：

class Person{ //定義一個名爲Person的類
   constructor(name,age){ //constructor是一個構造方法，用來接收參數
         this.name = name; this.age = age; } read(){ return "個人名字叫" + this.name + "今年" + this.age + "歲了" } } var obj = new Person ("一諾",18) console.log(obj.read()) //個人名字叫一諾今年18歲了

 

constructor方法是類的構造函數的默認方法，經過new 命令生成對象實例時，自動調用該方法。

class Box{
      constructor(){
            console.log("這個禮拜天氣不錯"); //當實例化對象時該行代碼會執行
   }
}

var obj = new Box();

 

constructor方法若是沒有顯式定義，會隱式生成一個constructor方法。因此即便你沒有添加構造函數，構造函數也是存在的。constructor方法默認返回實例對象this，可是也能夠指定constructor方法返回一個全新的對象，讓返回的實例對象不是該類的實例。

class Desk{
    constructor(){
       this.ss = "大千世界，無奇不有";
  }
}
class Box{
    constructor(){
       return new Desk();//沒有用this,直接返回一個全新的對象
  }
}
var obj = new Box();
console.log(obj.ss) //大千世界，無奇不有

class不錯在變量提高，因此須要先定義再使用。由於ES6不會把類的聲明提高到代碼的頭部，可是ES5就不同，ES5存在變量提高，能夠先使用，而後再定義

二、靜態方法
類至關於實例的原型，全部再類中定義的方法，都會被實例繼承。若是再一個方法前加上static關鍵字，就 表示該方法不會被實例繼承，而是直接經過類來調用，這就稱爲靜態方法

 

注意，若是靜態方法包含this關鍵字，這個this指的是類，而不是實例

          類的靜態方法不可被實例所繼承，卻能夠被子類繼承

三、靜態屬性

四、class的繼承

五、super關鍵字

參考地址：http://es6.ruanyifeng.com/#docs/class