TypeScript - Kelas: Panduan untuk Pemula

Hai teman, super bintang coding masa depan! ? Apakah Anda siap untuk melompat ke dunia menarik dari kelas TypeScript? Jangan khawatir jika Anda belum pernah menulis baris kode sebelumnya – kita akan memulai dari awal dan membangun tingkat demi tingkat. Pada akhir panduan ini, Anda akan menciptakan kelas seperti seorang pro! Jadi, mari kita mulai petualangan ini bersama.

Apa Itu Kelas?

Sebelum kita masuk ke detail, mari kita pahami apa itu kelas. Pahami kelas sebagai blueprint untuk menciptakan objek. Seperti arsitek yang menggunakan blueprint untuk membangun rumah, kita menggunakan kelas untuk menciptakan objek dalam kode kita. Objek ini dapat memiliki properti (seperti warna rumah) dan metode (seperti membuka pintu).

Membuat Kelas

mari kita mulai dengan menciptakan kelas pertamanya. Kita akan menciptakan kelas sederhana Car.

class Car {
make: string;
model: string;
year: number;

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

honk() {
console.log("Beep beep!");
}
}

mari kitauraikan ini:

1. Kita mulai dengan kata kunci class diikuti nama kelas kita, Car.
2. Dalam kelas, kita mendefinisikan properti: make, model, dan year.
3. constructor adalah metode khusus yang dipanggil saat kita menciptakan objek Car baru. Itu menyiapkan nilai awal untuk properti kita.
4. Kita juga memiliki metode honk yang, saat dipanggil, akan mencetak "Beep beep!" ke konsol.

Membuat Instance Objek

Sekarang kita memiliki kelas Car, mari kita ciptakan beberapa objek mobil!

let myCar = new Car("Toyota", "Corolla", 2020);
let yourCar = new Car("Honda", "Civic", 2019);

Disini, kita telah menciptakan dua objek Car: myCar dan yourCar. Kata kunci new memberitahu TypeScript untuk menciptakan instance baru dari kelas Car.

Mengakses Atribut dan Fungsi

Sekarang kita memiliki objek mobil, bagaimana kita menggunakannya? mari kita lihat:

console.log(myCar.make);  // Output: Toyota
console.log(yourCar.year);  // Output: 2019

myCar.honk();  // Output: Beep beep!

Kita menggunakan notasi titik untuk mengakses properti dan metode objek kita. Itu seperti mengatakan, "Hey, myCar! Apa make kamu?" atau "Hey, myCar! Berikan kami suara hornmu!"

Pewarisan Kelas

Pewarisan adalah fitur yang kuat yang memungkinkan kita menciptakan kelas baru berdasarkan kelas yang sudah ada. mari kita buat kelas SportsCar yang mewarisi dari kelas Car:

class SportsCar extends Car {
topSpeed: number;

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

race() {
console.log(`Racing at ${this.topSpeed} mph!`);
}
}

let mySpeedster = new SportsCar("Ferrari", "F8", 2021, 210);
mySpeedster.honk();  // Output: Beep beep!
mySpeedster.race();  // Output: Racing at 210 mph!

Ini adalah apa yang terjadi:

1. Kita menggunakan kata kunci extends untuk mewarisi dari Car.
2. Kita menambahkan properti baru topSpeed.
3. Dalam constructor, kita memanggil super() untuk menginisialisasi properti dari kelas induk.
4. Kita menambahkan metode race yang khusus untuk SportsCar.

Kelas SportsCar memiliki semua properti dan metode Car, ditambah penambahan sendiri!

Penimpaan Metode

kadang-kadang, kita ingin mengubah bagaimana metode dari kelas induk bekerja dalam kelas anak. Ini disebut penimpaan metode. mari kita timpa metode honk dalam SportsCar:

class SportsCar extends Car {
// ... kode sebelumnya ...

honk() {
console.log("Vroom vroom!");
}
}

mySpeedster.honk();  // Output: Vroom vroom!

Sekarang saat kita memanggil honk() pada SportsCar, itu membuat suara yang lebih sporty!

Kata Kunci static

Kata kunci static memungkinkan kita menciptakan properti dan metode yang milik kelas itu sendiri, bukan instance kelas. mari kita tambahkan metode statis ke kelas Car:

class Car {
// ... kode sebelumnya ...

static numberOfWheels() {
return 4;
}
}

console.log(Car.numberOfWheels());  // Output: 4

Kita dapat memanggil metode ini langsung pada kelas Car, tanpa menciptakan instance.

Operator instanceof

Operator instanceof memungkinkan kita memeriksa jika objek adalah instance dari kelas tertentu:

console.log(myCar instanceof Car);  // Output: true
console.log(mySpeedster instanceof SportsCar);  // Output: true
console.log(mySpeedster instanceof Car);  // Output: true
console.log(myCar instanceof SportsCar);  // Output: false

Ini berguna saat Anda perlu memeriksa jenis objek yang Anda hadapi.

Penyembunyian Data

Dalam TypeScript, kita dapat menggunakan pemodifikasi akses untuk mengontrol visibilitas anggota kelas. Ada tiga pemodifikasi akses: public, private, dan protected:

class BankAccount {
private balance: number;

constructor(initialBalance: number) {
this.balance = initialBalance;
}

public deposit(amount: number) {
this.balance += amount;
}

public withdraw(amount: number) {
if (amount <= this.balance) {
this.balance -= amount;
} else {
console.log("Insufficient funds!");
}
}

protected getBalance() {
return this.balance;
}
}

• private: Hanya dapat diakses dalam kelas.
• public: Dapat diakses dari mana saja (default jika tidak ditentukan).
• protected: Dapat diakses dalam kelas dan kelas turunannya.

Kelas dan Antarmuka

Antarmuka di TypeScript memungkinkan kita mendefinisikan kontrak untuk kelas kita. mari kita buat antarmuka untuk kelas Car:

interface Vehicle {
make: string;
model: string;
year: number;
honk(): void;
}

class Car implements Vehicle {
// ... implementasi ...
}

Dengan mengimplementasikan antarmuka, kita memastikan bahwa kelas kita mengikuti struktur tertentu.

Ringkasan Metode

Berikut ini adalah ringkasan metode yang kita pelajari dalam panduan ini:

Metode	Deskripsi
constructor()	Inisialisasi instance kelas baru
honk()	Menghasilkan suara horn mobil
race()	Simulasi balap (untuk SportsCar)
static numberOfWheels()	Mengembalikan jumlah roda (untuk kelas Car)
deposit()	Menambahkan uang ke rekening bank
withdraw()	Mengambil uang dari rekening bank
getBalance()	Mengembalikan saldo rekening bank

Dan itu saja! Anda telah mengambil langkah pertama ke dunia kelas TypeScript. Ingat, latihan membuat sempurna, jadi jangan khawatir untuk mencoba konsep ini. Buat kelas Anda sendiri, campurkan dan cocokkan fitur berbeda, dan yang paling penting, bersenang-senang dalam mengoding! Siapa tahu, mungkin Anda yang akan mengajarkan kelas ini kali berikutnya! ?

Credits: Image by storyset