Inheritance JavaScript: extends, super, dan Override Method

Satu Class Dibangun di Atas Class Lain

Inheritance memungkinkan sebuah class memulai dari cetak biru class lain lalu memperluasnya. Kamu mendapat setiap field dan method milik parent secara gratis, dan bisa menambah atau mengubah apa pun yang kamu butuhkan:

class Animal {
    constructor(name) {
        this.name = name;
    }

    speak() {
        return `${this.name} makes a sound`;
    }
}

class Dog extends Animal {
    fetch() {
        return `${this.name} fetches the ball`;
    }
}

const rex = new Dog("Rex");
console.log(rex.speak());
console.log(rex.fetch());

Dog extends Animal berarti: "Dog adalah Animal, ditambah sedikit lagi." rex tidak punya method speak sendiri, tetapi pencariannya berlanjut ke Animal, yang memilikinya. Kelanjutan pencarian itulah seluruh mekanismenya: ini hanyalah rantai prototype dengan sintaks yang lebih enak.

super di Constructor

Subclass yang punya constructor sendiri wajib mengikuti satu aturan ketat: panggil super(...) sebelum menyentuh this. super menjalankan constructor milik parent, yang sebenarnya membuat dan menginisialisasi objeknya:

class Animal {
    constructor(name) {
        this.name = name;
    }
}

class Dog extends Animal {
    constructor(name, breed) {
        super(name);
        this.breed = breed;
    }
}

const rex = new Dog("Rex", "Labrador");
console.log(rex.name, rex.breed);

Lewatkan baris super(name) dan kamu akan mendapat ReferenceError begitu mencoba membaca atau mengisi this. Engine sama sekali tidak mau memberimu this sebelum parent mendapat gilirannya.

Kalau subclass tidak mendeklarasikan constructor sendiri, JavaScript membuatkan satu yang meneruskan semua argumen ke super. Jadi kamu hanya perlu menulisnya saat menambahkan field atau melakukan persiapan tambahan.

Override Method

Subclass bisa mendefinisikan ulang method apa pun yang diwarisinya. Yang paling dekat di rantai yang menang:

class Animal {
    speak() {
        return "generic animal noise";
    }
}

class Dog extends Animal {
    speak() {
        return "woof";
    }
}

class Cat extends Animal {
    speak() {
        return "meow";
    }
}

console.log(new Animal().speak());
console.log(new Dog().speak());
console.log(new Cat().speak());

Tidak ada sihir di sini: saat kamu memanggil speak() pada Dog, engine mencari speak di instance, lalu di Dog.prototype, menemukannya, dan berhenti. Pencariannya tidak pernah sampai ke Animal.prototype.

Memperluas, Bukan Mengganti: super.method()

Kadang kamu tidak ingin mengganti method milik parent, melainkan menambahinya. super.method(...) memanggil versi milik parent dari dalam override:

class Animal {
    constructor(name) {
        this.name = name;
    }

    describe() {
        return `I am ${this.name}`;
    }
}

class Dog extends Animal {
    describe() {
        const base = super.describe();
        return `${base}, and I am a dog`;
    }
}

console.log(new Dog("Rex").describe());

Di sinilah inheritance menunjukkan manfaatnya: subclass memakai ulang logika parent alih-alih menyalinnya. Kalau Animal.describe berubah nanti, Dog.describe ikut mendapat perubahan itu secara gratis.

super bisa dipakai di method mana pun, bukan hanya di constructor. Ia selalu merujuk ke versi milik class parent dari apa pun yang sedang kamu panggil.

instanceof dan Rantainya

instanceof mengecek apakah rantai prototype sebuah objek mencakup class tertentu. Setiap instance subclass juga merupakan instance dari parent-parent-nya:

class Animal {}
class Dog extends Animal {}
class Puppy extends Dog {}

const p = new Puppy();
console.log(p instanceof Puppy);
console.log(p instanceof Dog);
console.log(p instanceof Animal);
console.log(p instanceof Object);

Keempatnya bernilai true. Rantainya Puppy -> Dog -> Animal -> Object, dan instanceof menelusurinya. Berguna untuk pengecekan tipe, walaupun dalam praktiknya kamu akan lebih jarang memakainya daripada yang kamu kira: kebanyakan kode cukup memanggil method dan membiarkan polimorfisme menangani sisanya.

Contoh yang Sedikit Lebih Besar

Pola yang umum: class dasar dengan logika bersama, dan beberapa subclass yang mengkhususkannya.

class Shape {
    constructor(name) {
        this.name = name;
    }

    area() {
        return 0;
    }

    describe() {
        return `${this.name} with area ${this.area().toFixed(2)}`;
    }
}

class Circle extends Shape {
    constructor(radius) {
        super("Circle");
        this.radius = radius;
    }

    area() {
        return Math.PI * this.radius ** 2;
    }
}

class Rectangle extends Shape {
    constructor(width, height) {
        super("Rectangle");
        this.width = width;
        this.height = height;
    }

    area() {
        return this.width * this.height;
    }
}

const shapes = [new Circle(5), new Rectangle(4, 6)];
shapes.forEach(s => console.log(s.describe()));

Perhatikan bahwa describe berada di Shape dan tidak pernah perlu ditulis ulang. Ia hanya memanggil this.area(), yang mengarah ke subclass yang tepat saat runtime. Itulah polimorfisme: tempat pemanggilan yang sama, perilaku berbeda tergantung objek sebenarnya.

Inheritance vs Komposisi

Inheritance menggoda karena terasa produktif: satu baris memberimu setumpuk method. Tetapi ia sulit dirawat saat hierarkinya tumbuh.

Pegangan praktisnya: pakai extends saat hubungannya jelas "X adalah sebuah Y" dan subclass memang memakai sebagian besar perilaku parent-nya. Saat kamu memakai inheritance hanya untuk berbagi satu atau dua method helper, utamakan komposisi: beri class itu sebuah field yang memegang objek helper-nya:

// Composition: User "has a" logger, not "is a" logger.
class Logger {
    log(message) {
        console.log(`[log] ${message}`);
    }
}

class User {
    constructor(name) {
        this.name = name;
        this.logger = new Logger();
    }

    greet() {
        this.logger.log(`Hello from ${this.name}`);
    }
}

new User("Ada").greet();

Pohon inheritance yang dalam (Animal -> Mammal -> Dog -> WorkingDog -> PoliceDog) terlihat rapi di diagram tetapi menyakitkan di kode: perubahan di dekat akarnya merambat tanpa bisa ditebak ke setiap turunannya. Kebanyakan codebase yang sehat hanya sedalam satu atau dua tingkat dan mengandalkan komposisi untuk sisanya.

Berikutnya: Static Member

Semua yang ada di dokumentasi ini berada di instance, yaitu method yang kamu panggil lewat new Thing().something(). Kadang kamu ingin method atau data yang dimiliki class itu sendiri, bukan instance tertentu. Untuk itulah static ada, dan itu dibahas berikutnya.