📘super

JS ⟩ value ⟩ object ⟩ class ⟩ inheritance ⟩ super

access properties on object literal / class's prototype object. (super.prop / super[expr] are valid in any method definition in object literal / class)
invoke superclass constructor. (super(...args) is valid in class constructors)

// in any method definition
super.prop        // parent's property
super[expr]       // (same)

// in subclass constructor
super(...args)    // superclass constructor

super

is not a variable that points to the prototype object❗
attempting to read super itself is a SyntaxError❗

arrow functions do not have super. (👉 see: Arrow functions revisited)
If accessed, it’s taken from the outer function.

👉 see: JavaScript.info

💾 程式： replit

// superclass
class A {

    constructor(name) {
        this.speed = 0;
        this.name = name;
    }

    // ⭐ super.stop()
    stop() {
        this.speed = 0;
        log(`${this.name} stands still.`);
    }

}


class B extends A {
    
    // ✅ OK
    stop() {
        // ---------------------------------------------------
        // • arrow function doesn't have its own `super`.
        // • if accessed, it’s taken from the outer function.
        // ---------------------------------------------------
        // ⭐ call `super.stop()` after 1 sec
        //         ╭── arrow func ──╮
        setTimeout(() => super.stop(), 1000);    
    }
    
    // ❌ doesn't work
    stop2() {
        //          ╭──── ❌ regular func ───╮
        setTimeout( function(){ super.stop() }, 1000);
        //                      ^^^^^
        // ⛔ SyntaxError: 'super' keyword unexpected here.
    }
}

new B("Bunny").stop();    // "Bunny stands still." (after 1 sec)

⭐️ 非常重要：

super can only be used within methods.
super === [[HomeObject]].[[Prototype]]⭐️
a method's HomeObject is only used when calling super.
if a method does not use super, then we can still consider it "free" (like a free function)

⭐️ derived class initialization 的過程：

先執行 super()。若 parent class 為：
- base class：
  1. 新增 this 物件，並初始化 base class fields。
  2. 執行 base constructor。
- derived class： (recursive) 過程 1. 2. 3. 再跑一遍。
初始化 derived class fields。
執行 derived constructor 裡面 super() 以下的初始化動作。

👉 see： override class fields

if a method does not use super, then we can still consider it "free" (like a free function).
it’s not safe to copy a method with super from one object to another. (a method remembers its [[HomeObject]])

👉 See： [[HomeObject]]

this
super === [[HomeObject]].[[Prototype]]⭐️
must call super in override constructor.
override methods can call super.
derived class fields are initialized immediately after super().
a method's HomeObject is only used when calling super.
arrow function doesn’t have own this or super.
question class A vs. class A extends Object relates to super.
super is used in mixin inheritance.

Previousinheritance Nextderived class init

Last updated 2 years ago