super 關鍵字被使用於通過函式存取父層
super.prop
與 super[expr]
表達有效在 method definition 與 classes 與 object literals.
語法
super([arguments]); // calls the parent constructor. super.functionOnParent([arguments]);
描述
當使用建構子,super
關鍵字必須出現在this
關鍵字之前使用,super
關鍵字也可以使用在呼叫函式與父對象
範例
在類別中使用 super
這個程式碼片段從 classes sample (live demo). 這裏的 super()
被呼叫去避免複製到建構子的 Rectangle
與 Square
的共通部分。
class Rectangle {
constructor(height, width) {
this.name = 'Rectangle';
this.height = height;
this.width = width;
}
sayName() {
console.log('Hi, I am a ', this.name + '.');
}
get area() {
return this.height * this.width;
}
set area(value) {
this.area = value;
}
}
class Square extends Rectangle {
constructor(length) {
this.height; // ReferenceError, super needs to be called first!
// Here, it calls the parent class's constructor with lengths
// provided for the Rectangle's width and height
super(length, length);
// Note: In derived classes, super() must be called before you
// can use 'this'. Leaving this out will cause a reference error.
this.name = 'Square';
}
}
Super-calling 靜態方法
你也可以使用在靜態方法.
class Rectangle {
constructor() {}
static logNbSides() {
return 'I have 4 sides';
}
}
class Square extends Rectangle {
constructor() {}
static logDescription() {
return super.logNbSides() + ' which are all equal';
}
}
Square.logDescription(); // 'I have 4 sides which are all equal'
刪除 super 屬性將拋出錯誤
你不能使用 delete operator 以及 super.prop
以及 super[expr]
去刪除父層的類別屬性, 不然他會丟出一個錯誤 ReferenceError
.
class Base {
constructor() {}
foo() {}
}
class Derived extends Base {
constructor() {}
delete() {
delete super.foo; // this is bad
}
}
new Derived().delete(); // ReferenceError: invalid delete involving 'super'.
super.prop 不能複寫在不能複寫的屬性
當定義不可寫屬性,例如 Object.defineProperty
, super
不能複寫這個屬性的值.
class X {
constructor() {
Object.defineProperty(this, 'prop', {
configurable: true,
writable: false,
value: 1
});
}
}
class Y extends X {
constructor() {
super();
}
foo() {
super.prop = 2; // Cannot overwrite the value.
}
}
var y = new Y();
y.foo(); // TypeError: "prop" is read-only
console.log(y.prop); // 1
使用 super.prop 在對象符號
Super 可以使用在 object initializer / literal 符號. 在這個範例, 有兩個對象定義在一個方法. 在第二個對象裡面, super
呼叫了第一個對象的方法. 這個動作幫助 Object.setPrototypeOf()
讓我們可以設定原型 obj2
to obj1
, 所以 super
可以發現 method1
在 obj1
裡被找到.
var obj1 = {
method1() {
console.log('method 1');
}
}
var obj2 = {
method2() {
super.method1();
}
}
Object.setPrototypeOf(obj2, obj1);
obj2.method2(); // logs "method 1"
規格
Specification | Status | Comment |
---|---|---|
ECMAScript (ECMA-262) The definition of 'super' in that specification. |
Living Standard | |
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'super' in that specification. |
Standard | Initial definition. |
Browser compatibility
BCD tables only load in the browser
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.