📘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)

⭐️ 重點

👥 相關

✨ 範例

📗 參考

📘 手冊