TypeScript - Pewarisan
Hai, para pemrogram masa depan! Hari ini, kita akan memulai sebuah perjalanan menarik ke dunia pewarisan di TypeScript. Sebagai guru komputer yang ramah di lingkungan sekitar Anda, saya disini untuk mengorbit Anda melalui topik yang menarik ini. Jadi, siapkan tas virtual Anda, dan mari kita masuk ke dalamnya!
Apa Itu Pewarisan?
Sebelum kita mulai, mari kita pahami apa yang sebenarnya dimaksudkan oleh pewarisan. Bayangkan Anda membuat sebuah pohon keluarga. Setiap generasi baru mewarisi beberapa ciri dari orang tua mereka. Dalam pemrograman, pewarisan bekerja sama seperti itu. Ini memungkinkan kelas baru untuk didasarkan pada kelas yang sudah ada, mewarisi properti dan metode nya. Menarik, kan?
Pewarisan Kelas Tunggal
Mari kita mulai dengan bentuk paling sederhana dari pewarisan: pewarisan kelas tunggal. Ini adalah saat satu kelas (kelas anak) mewarisi dari 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
- Kita mendefinisikan kelas dasar
Animal
dengan propertiname
dan metodemakeSound
. - Kemudian kita membuat kelas
Dog
yang mewarisiAnimal
. - Kelas
Dog
memiliki propertibreed
nya sendiri. - Kita menggunakan kata kunci
super
dalam kontrukturDog
untuk memanggil kontrukturAnimal
. - Kita menimpa metode
makeSound
dalam kelasDog
.
Kata Kunci Super
Anda mungkin telah melihat kata kunci super
dalam contoh sebelumnya. Mari kita masuk lebih dalam 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()} dengan ${this.numDoors} pintu`;
}
}
let myCar = new Car("Toyota", "Corolla", 4);
console.log(myCar.getInfo()); // Output: Toyota Corolla dengan 4 pintu
Penjelasan
- Kata kunci
super
digunakan dalam konukturCar
untuk memanggil konukturVehicle
. - Dalam metode
getInfo
kelasCar
, kita menggunakansuper.getInfo()
untuk memanggil metodegetInfo
kelas induk.
Kata kunci super
memungkinkan kita untuk mengakses dan memanggil fungsi di 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 Lainnya
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
- Kita memiliki kelas dasar
Shape
dengan metodegetArea
yang mengembalikan 0. - Kedua kelas
Circle
danRectangle
mewarisiShape
dan menimpa metodegetArea
dengan implementasi mereka sendiri. - Kelas
Circle
menghitung luas menggunakan rumus πr². - Kelas
Rectangle
menghitung luas dengan mengkalikan lebar dan tinggi.
Pewarisan Multilevel
Pewarisan multilevel melibatkan kelas anak mewarisi dari kelas anak lain. Itu seperti pohon keluarga dengan beberapa generasi.
Contoh Pewarisan 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
- Kita memiliki kelas
Grandparent
dengan propertisurname
. - Kelas
Parent
mewarisiGrandparent
dan menambahkan propertifirstName
. - Kelas
Child
mewarisiParent
dan menambahkan propertimiddleName
. - Setiap kelas memiliki implementasi metode
getFullName
nya sendiri.
Ringkasan Metode Pewarisan
Berikut adalah tabel yang menggabungkan metode dan kata kunci utama yang 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 pewarisan di TypeScript. Ingat, latihan membuatah. Jangan khawatir untuk mencoba konsep ini. Semoga Anda sukses, para ahli TypeScript masa depan!
Credits: Image by storyset