ES6-class

一、ES6中的類徹底能夠看做構造函數的另外一種寫法。

class Point{
    //..
  }
  typeof Point //'function'
  Point === Point.prototype.constructor // true

類的數據類型就是函數，類自己指向構造函數

 

   class Point{
    //..
    constructor(){

    }
    toString(){

    }
    toValue(){

    }
  }
  // 等同於
 Point.prototype = {
  constructor(){},
  toString(){},
  toValue(){}
 } 

Object.assign方法能夠很方便的一次向類添加多個方法。

 Object.assign(Point.prototype,{
  toString(){},
  toValue(){}
 })

類的內部定義的全部方法都是不可枚舉的

二、constructor

constructor 方法是類的默認方法，經過new命令生成對象實例時自動調用該方法。一個類必須有constructor方法，若是沒有顯示定義，空的constructor會被添加。

三、實例對象

使用new

類的全部實例共享一個原型對象

 var p1 = new Point(2,3);
 var p2 = new Point(3,3);
 p1.__proto__ = p2.__proto__

四、不存在變量提高

class不存在變量提高

五、class 的繼承

class 之間能夠經過extends關鍵字實現繼承

 class colorpoint extends point {}

super 關鍵字，指代父類的實例（即父類的this對象）

子類必須在constructor方法中調用super方法，不然新建實例時會報錯，由於子類沒有本身的this對象。

ES6的繼承機制徹底不一樣，實質上是先創造父類的實例對象this，而後再用子類的構造函數修改this

只有調用super以後，纔可使用this關鍵字

六、類的prototype屬性和__proto__屬性

在ES5中，每個對象都有__proto__屬性，指向對應的構造函數的prototype屬性。

ES5：

1.對象有屬性__proto__,指向該對象的構造函數的原型對象。
2.方法除了有屬性__proto__,還有屬性prototype，prototype指向該方法的原型對象。

class 做爲構造函數的語法糖，同時有prototype屬性和__proto__屬性

一、子類的__proto__屬性表示構造函數的繼承，老是指向父類。

二、子類prototype 屬性的__proto__屬性表示方法的繼承，老是指向父類的prototype屬性。

 class B extends A {

 }
 B.__proto__ === A//true
 B.prototype.__proto__ === A.prototype // true

 

Object.setPrototypeOf(B.prototype, A.prototype);// B 的實例繼承 A 的實例

// 等同於
B.prototype.__proto__ = A.prototype;

// B 的實例繼承 A 的靜態屬性

Object.setPrototypeOf(B, A); // 等同於 B.__proto__ = A;

這兩條繼承鏈，能夠這樣理解：做爲一個對象，子類（B）的原型（__proto__屬性）是父類（A）；做爲一個構造函數，子類（B）的原型對象（prototype屬性）是父類的原型對象（prototype屬性）的實例。

七、實例的__proto__屬性

子類實例的__proto__屬性的__proto__屬性，指向父類實例的__proto__屬性。也就是說，子類的原型的原型，是父類的原型

var p1 = new Point(2, 3);
var p2 = new ColorPoint(2, 3, 'red');

p2.__proto__ === p1.__proto__ // false
p2.__proto__.__proto__ === p1.__proto__ // true

八、class 的靜態方法

若是在一個方法前加上static關鍵字，就表示該方法不會被實例繼承，而是直接經過類調用，稱爲靜態方法。

父類的靜態方法能夠被子類繼承