JavaScript - Konstruktor Objek
Hai, para pemrogram yang sedang berkembang! Hari ini, kita akan melihat dunia yang menarik dari Konstruktor Objek JavaScript. Sebagai guru ilmu komputer yang ramah di lingkungan Anda, saya sangat gembira untuk mengantar Anda dalam perjalanan ini. Jadi, siapkan topi keras maya Anda, dan mari kita mulai membangun beberapa objek!
Konstruktor Objek
Bayangkan Anda menjalankan sebuah toko hewan ajaib. Anda memiliki banyak hewan berbeda, masing-masing dengan kumpulan karakteristiknya sendiri. Daripada menulis setiap hewan secara terpisah, bagaimana jika kita bisa membuat sebuah rancangan untuk hewan-hewan ajaib kita? Itu tepatnya apa yang dilakukan konstruktor objek di JavaScript!
Konstruktor objek seperti sebuah pabrik yang menghasilkan objek dengan properti dan metode yang mirip. Mari kita buat sebuah konstruktor sederhana untuk hewan ajaib kita:
function MagicalPet(name, species, specialPower) {
this.name = name;
this.species = species;
this.specialPower = specialPower;
this.introduce = function() {
console.log(`Hi, saya ${this.name}, sebuah ${this.species} dengan kekuatan ${this.specialPower}!`);
};
}
Sekarang, mari kitauraikan ini:
- Kita mendefinisikan sebuah fungsi yang dinamai
MagicalPet
dengan parameter untuk nama, jenis, dan kekuatan khusus. - Dalam fungsi ini, kita menggunakan
this
untuk memberikan parameter ini sebagai properti objek. - Kita juga mendefinisikan sebuah metode yang dinamai
introduce
yang mencetak sebuah pengenalan.
Untuk membuat seekor hewan ajaib baru, kita menggunakan kata kunci new
:
let fluffy = new MagicalPet("Fluffy", "naga", "nafas api");
fluffy.introduce(); // Output: Hi, saya Fluffy, sebuah naga dengan kekuatan nafas api!
Voila! Kita baru saja membuat hewan ajaib pertamanya menggunakan konstruktor objek. Apakah itu menarik?
Menambahkan Properti atau Metode ke Konstruktor
kadang-kadang, setelah membuat konstruktor kita, kita mungkin menyadari bahwa kita lupa menambahkan properti atau metode yang penting. Tidak perlu khawatir! Kita dapat menambahkannya kemudian menggunakan prototype.
Mari kita tambahkan properti age
dan metode birthday
ke MagicalPet
:
MagicalPet.prototype.age = 0;
MagicalPet.prototype.birthday = function() {
this.age++;
console.log(`${this.name} sekarang ${this.age} tahun!`);
};
Sekarang, setiap hewan ajaib akan memiliki umur (mulai dari 0) dan dapat merayakan ulang tahun:
fluffy.birthday(); // Output: Fluffy sekarang 1 tahun!
fluffy.birthday(); // Output: Fluffy sekarang 2 tahun!
Prototipe Objek JavaScript
Anda mungkin bertanya-tanya, "Apa itu hal 'prototipe' yang kita gunakan saja?" Baiklah, pikirkan itu seperti sebuah tas shared yang semua objek yang diciptakan dari constructor yang sama membawa. Segala sesuatu yang kita masukkan ke tas ini dapat diakses oleh semua objek.
Ketika kita menambahkan properti atau metode ke prototype, kita secara essensial memasukkannya ke tas shared ini. Ini lebih hemat memori daripada menambahkannya langsung ke setiap objek, terutama jika kita memiliki banyak objek.
Berikut adalah representasi visualnya:
Konstruktor MagicalPet
|
v
Prototipe (Tas Shared)
- age
- birthday()
|
v
Objek MagicalPet Individual
- name
- species
- specialPower
- introduce()
Konstruktor Objek Bawaan di JavaScript
JavaScript datang dengan beberapa konstruktor objek bawaan yang Anda akan sering gunakan dalam petualangan coding Anda. Mari kita lihat beberapa di antaranya:
Konstruktor | Deskripsi | Contoh |
---|---|---|
String() | Membuat objek string | let greeting = new String("Hello"); |
Number() | Membuat objek number | let age = new Number(25); |
Boolean() | Membuat objek boolean | let isAwesome = new Boolean(true); |
Array() | Membuat objek array | let fruits = new Array("apple", "banana", "cherry"); |
Object() | Membuat objek generik | let emptyObj = new Object(); |
Date() | Membuat objek date | let today = new Date(); |
Meskipun kontruktur ini tersedia, perlu dicatat bahwa untuk jenis primitif seperti string, number, dan boolean, lebih umum dan efisien untuk menggunakan literal:
let greeting = "Hello"; // diprefersikan daripada new String("Hello")
let age = 25; // diprefersikan daripada new Number(25)
let isAwesome = true; // diprefersikan daripada new Boolean(true)
let fruits = ["apple", "banana"]; // diprefersikan daripada new Array("apple", "banana")
Namun, konstruktor seperti Date()
biasanya digunakan seperti yang ditunjukkan:
let birthday = new Date("1990-01-01");
console.log(birthday.getFullYear()); // Output: 1990
Dan itu saja, para penyihir kode muda! Kita telah melintasi realm Konstruktor Objek JavaScript, menambahkan properti dan metode ajaib, mengeksplorasi prototipe mistik, dan bahkan melihat beberapa konstruktor bawaan.
Ingat, latihan membuat sempurna. Cobalah membuat kontruktur Anda sendiri, mungkin untuk jenis penyihir berbeda atau makhluk ajaib. Semakin banyak Anda bermain dengan konsep ini, semakin natural mereka akan menjadi.
Tetap kode, tetap belajar, dan yang paling penting, tetap bersenang-senang! Sampai pelajaran berikutnya, semoga kode Anda bebas bug dan waktu kompiler Anda cepat!
Credits: Image by storyset