es6中的super怎么用

這篇“es6中的super怎么用”文章的知識(shí)點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“es6中的super怎么用”文章吧。

super的用法：1、super作為函數(shù)時(shí)，用于表示父類的構(gòu)造函數(shù)，語法為“constructor(){super();}”；2、super作為對(duì)象時(shí)，在普通方法中用于指向父類的原型對(duì)象，在靜態(tài)方法中用于指向父類。

本教程操作環(huán)境：windows10系統(tǒng)、ECMAScript 6.0版、Dell G3電腦。

es6中super的用法是什么

第一種情況：super作為函數(shù)時(shí)，代表父類的構(gòu)造函數(shù)

ES6要求，子類的構(gòu)造函數(shù)，必須執(zhí)行一次super函數(shù)

class A {}
class B extends A {
  constructor() {
    super();//子類的構(gòu)造函數(shù)，必須執(zhí)行一次super函數(shù)，代表父類的構(gòu)造函數(shù)
  }
}

注意：雖然super代表父類的構(gòu)造函數(shù)，但此時(shí)返回的時(shí)B的實(shí)例，即super內(nèi)部的this指的是B的實(shí)例，因此super()相當(dāng)于 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指向當(dāng)前正在執(zhí)行的函數(shù)，super()執(zhí)行的時(shí)候，它指向的是子類B的構(gòu)造函數(shù)，而不是父類A的構(gòu)造函數(shù)，也就是說，super()內(nèi)部的this指向B

super作為函數(shù)使用時(shí)，必須出現(xiàn)在子類的構(gòu)造函數(shù)constructor中,否則會(huì)報(bào)錯(cuò)

class A {}
class B extends A {
  m() {
    super(); // 報(bào)錯(cuò)
  }
}

第二種情況：super作為對(duì)象時(shí)，在普通方法中，指向父類的原型對(duì)象，在靜態(tài)方法中，指向父類

class A {
  p() {
    return 2;
  }
}
class B extends A {
  constructor() {
    super();//父類的構(gòu)造函數(shù)
    console.log(super.p()); // 2
  }
}
let b = new B();

上面代碼中，super作為函數(shù)時(shí)，代表父類的構(gòu)造方法，作為對(duì)象時(shí)，指向父類的原型對(duì)象，即A.prototype，所以super.p()相當(dāng)于A.prototype.p()

這里還需要注意，由于 super指向父類的原型，所以在父類實(shí)例上的屬性或者方法，并不能通過super調(diào)用

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

上面代碼中，p是父類A實(shí)例的屬性，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是定義在父類的原型對(duì)象上，所以可以使用super.x來訪問

以上就是關(guān)于“es6中的super怎么用”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對(duì)大家有幫助，若想了解更多相關(guān)的知識(shí)內(nèi)容，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。