es6中super的用法是什麼

super的用法：1、super當函數時，用來表示父類別的建構函數，語法為「constructor(){super();}」；2、super當物件時，在普通方法中用於指向父類的原型對象，在靜態方法中用於指向父類。

本教學操作環境：windows10系統、ECMAScript 6.0版、Dell G3電腦。

es6中super的用法是什麼

第一種情況：super當函數時，代表父類別的建構子

ES6要求，子類別的建構函數，必須執行一次super函數

class A {}
class B extends A {
  constructor() {
    super();//子类的构造函数，必须执行一次super函数，代表父类的构造函数
  }
}

注意：雖然super代表父類別的建構函數，但此時回傳的時B的實例，也就是super內部的this指的是B的實例，因此super()相當於A.prototype.constructor.call(this)

class A {
  constructor() {
    console.log(new.target.name);
  }
}
class B extends A {
  constructor() {
    super();
  }
}
new A() // A
new B() // B

上述程式碼中，new.target指向目前正在執行的函數，super()執行的時候，它指向的是子類別B的建構函數，而不是父類別A的建構函數，也就是說，super()內部的this指向B

super作為函數使用時，必須出現在子類別的建構子constructor中,否則會報錯

class A {}
class B extends A {
  m() {
    super(); // 报错
  }
}

第二種情況：super當物件時，在普通方法中，指向父類別的原型對象，在靜態方法中，指向父類別

class A {
  p() {
    return 2;
  }
}
class B extends A {
  constructor() {
    super();//父类的构造函数
    console.log(super.p()); // 2
  }
}
let b = new B();

上面程式碼中，super當函式時，代表父類別的建構方法，當物件時，指向父類別的原型對象，即A.prototype，所以super.p()相當於A.prototype.p()

這裡還需要注意，由於super指向父類別的原型，所以在父類別實例上的屬性或方法，並不能透過super呼叫

class A {
  constructor() {
    this.p = 2;
  }
}
class B extends A {
  get m() {
    return super.p;
  }
}
let b = new B();
b.m // undefined

上面程式碼中，p是父類別A實例的屬性，super.p 就引用不到它

如果屬性是定義在父類別的原型上，則使用super就可以存取

class A {}
A.prototype.x = 2;
class B extends A {
  constructor() {
    super();
    console.log(super.x) // 2
  }
}
let b = new B();

上面程式碼中，屬性x是定義在父類別的原型物件上，所以可以使用super.x來存取

【相關推薦：javascript影片教學、web前端】

以上是es6中super的用法是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章！