ES6學習筆記（二）：教你玩轉類的繼承和類的對象

繼承

程序中的繼承： 子類能夠繼承父類的一些屬性和方法

class Father { //父類
  constructor () {
    }
    money () {
    console.log(100)
  }
}
class Son extends Father {  //子類繼承父類
}
let son = new Son()
son.money() // 100
son.

super關鍵字

super關鍵字用於訪問和調用對象父類上的函數，能夠經過調用父類的構造函數，也能夠調用父類的普通函數

class Father { //父類
  constructor (x, y) {
    this.x = x
    this.y = y
    }
    money () {
    console.log(100)
  }
  sum () {
    console.log(this.x + this.y)
  }
}
class Son extends Father {  //子類繼承父類
    constructor (x, y) {
        super(x, y) //調用了父類中的構造函數
  }
}
let son = new Son(1,2)
son.sum() // 3
son.

繼承的特色：

1. 繼承中，若是實例化子類輸出一個方法，先看子類有沒有這個方法，若是有就先執行子類，（就近原則）
2. 繼承中，若是子類裏面沒有，就去查找父類有沒有這個方法，若是有，就執行父類的這個方法
3. 在子類中，能夠用super調用父類元素的方法

class Father {
    say() {
    return '我是父元素'
  }
  sing() {
    return '父元素唱一首歌'
  }
    
}
class Son extends Father {
    say() {
    console.log('我是子元素')
  }
  sing() {
    console.log(super.sing())
  }
}
var son = new Son()
son.say() //我是子元素
son.sing() //

子元素能夠繼承父元素的方法的同時，子元素也能夠擴展本身的其餘方法，子類在構造函數中用super調用父類的構造方法時候，必須放在子類的this以前調用

class Father {
    constructor(x, y) {
    this.x = x
    this.y = y
  }
  sum() {
    console.log(this.x + this.y)
  }
}

class Son extends Father {
    constructor(x,y) {
     //利用super 調用父類的構造函數
    super(x,y)
    this.x = x
    this.y = y
  }
  subtract() {
    console.log(this.x - this.y)
  }
}
let son = new Son(5,3)
son.subtract() // 2
son.sum() //8

ES6中的類和對象的4個注意點：

1. 在ES6中類沒有變量提高，因此必須先定義類，才能經過類實例化對象
2. 類裏面的共有屬性和方法必定要加this使用
3. 類裏面的this指向問題

4. constructor裏面的this指向實例對象，方法裏面的this向這個方法的調用者
   

   總結

   這篇文章主要分享了，關於類的繼承、繼承須要的用到的extends,super、ES6中的類和對象的注意點等。
   若是想了解更多，請掃描二維碼