以下只是個人的學(xué)習(xí)筆記：

super這個關(guān)鍵字，既可以當(dāng)作函數(shù)使用，也可以當(dāng)作對象使用。在這兩種情況下，它的用法完全不同。

1、當(dāng)作函數(shù)使用

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

注意，super雖然代表了父類A的構(gòu)造函數(shù)，但是返回的是子類B的實(shí)例，即super內(nèi)部的this指的是B，因此super()在這里相當(dāng)于A.prototype.constructor.call(this)。

class A { constructor() {  console.log(new.target.name); //new.target指向當(dāng)前正在執(zhí)行的函數(shù) }}class B extends A { constructor() {  super(); }}new A() // Anew B() // B

可以看到，在super()執(zhí)行時(shí)，它指向的是子類B的構(gòu)造函數(shù)，而不是父類A的構(gòu)造函數(shù)。也就是說，super()內(nèi)部的this指向的是B。

2、當(dāng)作對象使用

在普通方法中，指向父類的原型對象；在靜態(tài)方法中，指向父類。

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

上面代碼中，子類B當(dāng)中的super.c()，就是將super當(dāng)作一個對象使用。這時(shí)，super在普通方法之中，指向A.prototype，所以super.c()就相當(dāng)于A.prototype.c()。

通過super調(diào)用父類的方法時(shí)，super會綁定子類的this。

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

上面代碼中，super.s()雖然調(diào)用的是A.prototype.s()，但是A.prototype.s()會綁定子類B的this，導(dǎo)致輸出的是2，而不是1。也就是說，實(shí)際上執(zhí)行的是super.s.call(this)。

由于綁定子類的this，所以如果通過super對某個屬性賦值，這時(shí)super就是this，賦值的屬性會變成子類實(shí)例的屬性。

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

上面代碼中，super.x賦值為3，這時(shí)等同于對this.x賦值為3。而當(dāng)讀取super.x的時(shí)候，讀的是A.prototype.x，所以返回undefined。

注意，使用super的時(shí)候，必須顯式指定是作為函數(shù)、還是作為對象使用，否則會報(bào)錯。

class A {}class B extends A { constructor() {  super();  console.log(super); // 報(bào)錯 }}

上面代碼中，console.log(super)當(dāng)中的super，無法看出是作為函數(shù)使用，還是作為對象使用，所以 JavaScript 引擎解析代碼的時(shí)候就會報(bào)錯。這時(shí)，如果能清晰地表明super的數(shù)據(jù)類型，就不會報(bào)錯。

最后，由于對象總是繼承其他對象的，所以可以在任意一個對象中，使用super關(guān)鍵字。