ES6中的super關鍵字詳解

es6重新實現了類的繼承，而在繼承的過程中，super關鍵字實現了至關重要的作用，可以說理解不了super關鍵字，也就掌握不了類的繼承，今天我們就一起來盤盤super這個關鍵字

首先丟擲乙個概念：super這個關鍵字，既可以當作函式使用，又可以當作物件使用

第一種情況：super作為函式時，代表父類的建構函式

es6要求，子類的建構函式，必須執行一次super函式

class
aclass
bextends
a}

注意：雖然super代表父類的建構函式，但此時返回的時b的例項，即super內部的this指的是b的例項，因此super()相當於a.prototype.constructor.call(this)

classa}
class
bextendsa}
newa()
// a
newb()
// b

上述**中，new.target指向當前正在執行的函式，super()執行的時候，它指向的是子類b的建構函式，而不是父類a的建構函式，也就是說，super()內部的this指向b

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

class
aclass
bextends
a}

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

classa}
class
bextendsa}
let b =
newb()
;

上面**中，super作為函式時，代表父類的構造方法，作為物件時，指向父類的原型物件，即a.prototype，所以super.p()相當於a.prototype.p()

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

classa}
class
bextendsa}
let b =
newb()
;b.m // undefined

上面**中，p是父類a例項的屬性，super.p就引用不到它

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

classaa
.prototype.x =2;
class
bextendsa}
let b =
newb()
;

上面**中，屬性x是定義在父類的原型物件上，所以可以使用super.x來訪問

es6規定，在子類普通方法中，通過super呼叫父類的方法時，方法內部的this指向當前的子類例項

class
aprint()
}class
bextendsam
()}let b =
newb()
;b.m(
)// 2

上面**中，super.print()雖然呼叫的是a.prototype.print()，但是內部的this指向子類b的例項，所以應該輸出2，實際執行的是super.print.call(this)

由於this指向子類例項，所以通過super對某個屬性賦值，這時super就是this，賦值的屬性也會變成子類例項的屬性

classa}
class
bextendsa}
let b =
newb()
;

上面**中，super.x = 3這裡相當於this.x = 3，給子類例項賦值，而取值的時候super.x相當於a.prototype.x，返回undefined

super作為物件，在靜態方法中使用，相當於父類，而不是父類的原型

class
parent
mymethod
(msg)
}class
child
extends
parent
mymethod
(msg)
}child.
mymethod(1
);// static 1
var child =
newchild()
;child.
mymethod(2
);// instance 2

上面**中，super在子類的靜態方法中指向父類，在普通方法中指向父類原型

另外。在子類的靜態方法

中通過super呼叫父類的方法時，方法內部的this指向當前的

子類**，而不是子類的例項**

class
astatic
print()
}class
bextends
astaticm(
)}b.x =3;
b.m(
)// 3

上述**中靜態方法b.m()中super指向父類，this指向子類，而不是子類例項

使用super的時候，必須顯示地指出是函式還是物件，否則會報錯

class
aclass
bextends
a}

上面**中的super，無法看出是物件還是函式，則會報錯，只要可以清晰的表明是函式還是物件，就不會報錯

class
aclass
bextendsa}
let b =
newb()
;

上面**可以看出super是乙個物件，則不會報錯

最後，由於物件總是繼承其他物件，所以可以在任意乙個物件中，使用super關鍵字

var obj =};
obj.
tostring()
;// myobject: [object object]

完！

ES6的 super 關鍵字

class之間可以通過extends關鍵字實現繼承，這比es5的通過修改原型鏈實現繼承，要清晰和方便很多。子類必須在constructor方法中呼叫super方法，否則新建例項時會報錯。這是因為子類沒有自己的this物件，而是繼承父類的this物件然後對其進行加工。如果不呼叫super方法，子類就...

ES6新增關鍵字

let 關鍵字特點塊級作用域 if語句和for語句之類的大括號會隔離作用域if true console.log a 10 console.log b 報錯 referenceerror b is not definedconsole.log a 因為有變數宣告的提公升所以會輸出 undefined...

Super關鍵字詳解

可以使用super關鍵字來訪問父類的資料成員或字段。如果父類和子類具有相同的字段，則使用super來指定為父類資料成員或字段。animal和dog都有乙個共同的屬性 color。如果我們列印color屬性，它將預設列印當前類的顏色。要訪問父屬性，需要使用super關鍵字指定 super關鍵字也可以用...

ES6中的super關鍵字詳解

ES6的 super 關鍵字

ES6新增關鍵字

Super關鍵字詳解

相關推薦