ES6學習筆記（二）：教你玩轉類的繼承和類的物件
阿新 • • 發佈：2020-02-28
繼承
程式中的繼承： 子類可以繼承父類的一些屬性和方法
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.
繼承的特點：
- 繼承中，如果例項化子類輸出一個方法，先看子類有沒有這個方法，如果有就先執行子類，（就近原則）
- 繼承中，如果子類裡面沒有，就去查詢父類有沒有這個方法，如果有，就執行父類的這個方法
- 在子類中，可以用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個注意點：
- 在ES6中類沒有變數提升，所以必須先定義類，才能通過類例項化物件
- 類裡面的共有屬性和方法一定要加this使用
- 類裡面的this指向問題
constructor裡面的this指向例項物件，方法裡面的this向這個方法的呼叫者
總結
這篇文章主要分享了，關於類的繼承、繼承需要的用到的extends,super、ES6中的類和物件的注意點等。
如果想了解更多，請掃描二維碼
