Penyerapan - Inheritance

Hai, para pemrogram masa depan! Hari ini, kita akan memulai perjalanan yang menarik ke dunia penyerapan dalam TypeScript. Sebagai guru komputer yang ramah di lingkungan sekitar Anda, saya disini untuk mengarahkan Anda melalui topik yang menarik ini. Jadi, ambil tas virtual Anda, dan mari kita masuk ke dalamnya!

TypeScript - Inheritance

Apa Itu Penyerapan?

Sebelum kita mulai, mari kita pahami apa yang sebenarnya dimaksudkan oleh penyerapan. Bayangkan Anda membuat suatu pohon keluarga. Setiap generasi baru mewarisi beberapa ciri dari orang tua mereka. Dalam pemrograman, penyerapan bekerja sama seperti itu. Ini memungkinkan kelas baru untuk didasarkan pada kelas yang sudah ada, mewarisi propertinya dan metode-metode nya. Menarik, kan?

Penyerapan Kelas Tunggal

Mari kita mulai dengan bentuk paling sederhana dari penyerapan: penyerapan kelas tunggal. Ini adalah saat satu kelas (kelas anak) mewarisi kelas lain (kelas induk).

Contoh Dasar

class Animal {
name: string;

constructor(name: string) {
this.name = name;
}

makeSound(): void {
console.log("Suara hewan generik");
}
}

class Dog extends Animal {
breed: string;

constructor(name: string, breed: string) {
super(name);
this.breed = breed;
}

makeSound(): void {
console.log("Woof! Woof!");
}
}

let myDog = new Dog("Buddy", "Golden Retriever");
console.log(myDog.name);  // Output: Buddy
console.log(myDog.breed); // Output: Golden Retriever
myDog.makeSound();        // Output: Woof! Woof!

Dalam contoh ini, Dog mewarisi dari Animal. Kata kunci extends digunakan untuk membuat kelas yang adalah anak dari kelas lain.

Penjelasan

  1. Kita mendefinisikan kelas dasar Animal dengan properti name dan metode makeSound.
  2. Kemudian kita membuat kelas Dog yang mewarisi Animal.
  3. Kelas Dog memiliki properti breed sendiri.
  4. Kita menggunakan kata kunci super dalam kontruktur Dog untuk memanggil kontruktur Animal.
  5. Kita menimpa metode makeSound dalam kelas Dog.

Kata Kunci Super

Anda mungkin telah mendengar kata kunci super dalam contoh kami sebelumnya. Mari kita masuk lebih mendalam apa yang ia lakukan.

Contoh dengan Super

class Vehicle {
make: string;
model: string;

constructor(make: string, model: string) {
this.make = make;
this.model = model;
}

getInfo(): string {
return `${this.make} ${this.model}`;
}
}

class Car extends Vehicle {
numDoors: number;

constructor(make: string, model: string, numDoors: number) {
super(make, model);
this.numDoors = numDoors;
}

getInfo(): string {
return `${super.getInfo()} with ${this.numDoors} doors`;
}
}

let myCar = new Car("Toyota", "Corolla", 4);
console.log(myCar.getInfo()); // Output: Toyota Corolla with 4 doors

Penjelasan

  1. Kata kunci super digunakan dalam kontruktur Car untuk memanggil konuktur Vehicle.
  2. Dalam metode getInfo dari Car, kita menggunakan super.getInfo() untuk memanggil metode getInfo dari kelas induk.

Kata kunci super memungkinkan kita untuk mengakses dan memanggil fungsi pada objek induk.

Penimpaan Metode

Penimpaan metode terjadi saat kelas anak menyediakan implementasi khusus untuk metode yang sudah didefinisikan dalam kelas induk. Kita sebenarnya telah melihat ini dalam kedua contoh sebelumnya!

Contoh Penimpaan Metode Lain

class Shape {
getArea(): number {
return 0;
}
}

class Circle extends Shape {
radius: number;

constructor(radius: number) {
super();
this.radius = radius;
}

getArea(): number {
return Math.PI * this.radius * this.radius;
}
}

class Rectangle extends Shape {
width: number;
height: number;

constructor(width: number, height: number) {
super();
this.width = width;
this.height = height;
}

getArea(): number {
return this.width * this.height;
}
}

let myCircle = new Circle(5);
console.log(myCircle.getArea()); // Output: 78.53981633974483

let myRectangle = new Rectangle(4, 5);
console.log(myRectangle.getArea()); // Output: 20

Penjelasan

  1. Kita memiliki kelas dasar Shape dengan metode getArea yang mengembalikan 0.
  2. Kedua kelas Circle dan Rectangle mewarisi Shape dan menimpa metode getArea dengan implementasi mereka sendiri.
  3. Kelas Circle menghitung luas menggunakan rumus πr².
  4. Kelas Rectangle menghitung luas dengan mengkalikan lebar dan tinggi.

Penyerapan Multilevel

Penyerapan multilevel melibatkan kelas anak yang mewarisi kelas anak lain. Itu seperti pohon keluarga dengan beberapa generasi.

Contoh Penyerapan Multilevel

class Grandparent {
surname: string;

constructor(surname: string) {
this.surname = surname;
}

getSurname(): string {
return this.surname;
}
}

class Parent extends Grandparent {
firstName: string;

constructor(firstName: string, surname: string) {
super(surname);
this.firstName = firstName;
}

getFullName(): string {
return `${this.firstName} ${this.getSurname()}`;
}
}

class Child extends Parent {
middleName: string;

constructor(firstName: string, middleName: string, surname: string) {
super(firstName, surname);
this.middleName = middleName;
}

getFullName(): string {
return `${this.firstName} ${this.middleName} ${this.getSurname()}`;
}
}

let myChild = new Child("John", "Doe", "Smith");
console.log(myChild.getFullName()); // Output: John Doe Smith

Penjelasan

  1. Kita memiliki kelas Grandparent dengan properti surname.
  2. Kelas Parent mewarisi Grandparent dan menambah properti firstName.
  3. Kelas Child mewarisi Parent dan menambah properti middleName.
  4. Setiap kelas memiliki implementasi metode getFullName mereka sendiri.

Ringkasan Metode Penyerapan

Berikut adalah tabel yang menggabungkan metode dan kata kunci utama yang telah kita diskusikan:

Metode/Kata Kunci Deskripsi
extends Digunakan untuk membuat kelas sebagai anak dari kelas lain
super() Memanggil konuktur kelas induk
super.method() Memanggil metode dari kelas induk
Penimpaan Metode Menyediakan implementasi baru untuk metode di kelas anak

Dan itu saja! Kita telah menutupi dasar-dasar penyerapan dalam TypeScript. Ingat, latihan membuat sempurna, jadi jangan ragu untuk mencoba konsep-konsep ini. Selamat coding, para ahli TypeScript masa depan!

Credits: Image by storyset