Arsitek Sistem Raksasa: OOP & Classes
Bayangkan kamu sedang membuat Game Mobile Legends. Kamu butuh menciptakan 10.000 Minion secara
bersamaan. Apakah kamu akan mengetik data { nama: "Minion 1", HP: 100 } sepuluh ribu kali
secara manual? Tentu tidak!
Kamu butuh sebuah Cetakan Pabrik (Blueprint). Cukup buat 1 Cetakan Minion, lalu cetak pakai
mesin fotokopi berkali-kali! Inilah inti dari Object-Oriented Programming (OOP). Di
JavaScript, konsep fotokopi DNA ini berawal dari wujud mesin aneh bernama Prototype, yang akhirnya
diganti bajunya menjadi Class modern pada era ES6+.
🧬 1. Mesin Kloning Purba: Prototype
Berbeda dengan bahasa Java atau C# yang kaku, JavaScript awalnya TIDAK memiliki fitur Class.
Sebagai gantinya, Brendon Eich (Pencipta JS) membuat mesin kloning gaib bernama Prototype.
Daripada membuat Kelas statis, di JS, sebuah Objek bisa langsung mewariskan DNA-nya ke Objek lain secara
hidup-hidup (Prototypical Inheritance).
// 1. Ini bukan fungsi biasa, ini CETAKAN (Constructor Function)!
// Biasanya diawali Huruf Kapital.
function Hero(nama, darah) {
this.nama = nama;
this.hp = darah;
}
// 2. Menanamkan JURUS ke dalam DNA Induk (Prototype)
Hero.prototype.serang = function() {
console.log(`${this.nama} menyerang wushhh!`);
}
// 3. Kloning Ribuan Hero pakai saklar 'new'
const hero1 = new Hero("Zilong", 500);
const hero2 = new Hero("Layla", 300);
hero1.serang(); // Zilong menyerang wushhh!
Rahasia Mengapa Pakai Prototype?
Kamu KETUDAK BOLEH membuat fungsi serang di DALAM tubuh function Hero()!
Mengapa?
Jika kamu memasukkan fungsi ke dalam, setiap kali kamu memanggil new Hero(), fungsi
tersebut akan dicipakan BARU dan menyita Memory RAM komputer. 10.000 Minion = 10.000 Salinan
Fungsi Serang! Komputer akan hang.
Jika kamu menanamnya di Prototype (DNA Induk), JS hanya membuat 1 buah Fungsi Serang Asli, dan 10.000 Minion tersebut hanya MEWARISI akses link (jalan tikus) menuju fungsi tunggal tersebut! Memory RAM selamat!
🏛️ 2. Arsitektur Modern: ES6 Classes
Banyak programmer dari bahasa lain muak melihat kerumitan ketik .prototype. Maka, fitur kosmetik
Sintaks class diciptakan di ES6. Ketahuilah: Di balik layar, ia TETAPLAH
menggunakan Prototype JS yang aneh tadi! Ia hanyalah baju palsu (Syntactic Sugar) agar Sintaks JS
terlihat mirip bahasa C++/Java.
// 1. Baju baru ES6: Terlihat megah dan rapi dalam satu kotak!
class Karakter {
// a. Titik awal mesin menyala pembentuk Variabel Koper (Wajib)
constructor(namaPanggilan, nyawaAwal) {
this.nama = namaPanggilan;
this.hp = nyawaAwal;
}
// b. Fungsi (Method), otomatis tertanam di Prototype tanpa perlu '.prototype'! Menakjubkan.
bertahan() {
console.log(`${this.nama} mengangkat tameng raksasa! 🛡️`);
}
}
// 2. Pemakaian (Instansiasi) tetap sama persis:
const tanker = new Karakter("Franco", 3000);
tanker.bertahan(); // Franco mengangkat tameng raksasa! 🛡️
👑 3. Garis Keturunan: Inheritance
Kekuatan super lain dari Class adalah kemampuannya Beranak-Pinak (Inheritance). Kita bisa
membuat Class Anak yang mewarisi SELURUH kemampuan Class Bapak, ditambah kemampuan sakti sang anak sendiri
menggunakan pedang extends dan super()!
⚔️ Studi Kasus OOP: Evolusi Tipe Karakter Game
Terminal Game Engine
▶ Eudora berjalan tap tap.
▶ Eudora meluncurkan badai Petir!! ⚡
*Penyihir secara otomatis BISA berjalan, meskipun di tubuh kode `class Penyihir` kita TIDAK PERNAH menulis fungsi berjalan. Itulah magisnya Garis Keturunan `extends`!