JavaScript - Object Constructors

Hai, para pemrogram yang sedang berkembang! Hari ini, kita akan melompat ke dunia yang menarik dari Konstruktor Object JavaScript. Sebagai guru ilmu komputer yang ramah di lingkungan sekitar Anda, saya sangat senang untuk mengantar Anda dalam perjalanan ini. Jadi, siapkan topi keras maya Anda, dan mari kita mulai membangun beberapa objek!

JavaScript - Object Constructors

Konstruktor Object

Bayangkan Anda menjalankan sebuah toko hewan ajaib. Anda memiliki banyak hewan berbeda, masing-masing dengan kumpulan karakteristiknya sendiri. Daripada menulis setiap hewan secara terpisah, apakah tidak akan menyenangkan jika kita bisa membuat blueprint untuk hewan-hewan ajaib kami? Itu tepatnya apa yang dilakukan konstruktor objek di JavaScript!

Konstruktor objek seperti pabrik yang menghasilkan objek dengan properti dan metode yang mirip. Mari kita buat konstruktor sederhana untuk hewan ajaib kami:

function MagicalPet(name, species, specialPower) {
this.name = name;
this.species = species;
this.specialPower = specialPower;
this.introduce = function() {
console.log(`Hai, saya ${this.name}, sebuah ${this.species} dengan kekuatan ${this.specialPower}!`);
};
}

Sekarang, mari kitauraikan ini:

  1. Kita mendefinisikan sebuah fungsi yang disebut MagicalPet dengan parameter untuk nama, jenis, dan kekuatan khusus.
  2. Dalam fungsi ini, kita menggunakan this untuk menugaskan parameter ini sebagai properti objek.
  3. Kita juga mendefinisikan metode introduce yang mencetak pengenalan.

Untuk membuat hewan ajaib baru, kita gunakan kata kunci new:

let fluffy = new MagicalPet("Fluffy", "naga", "nafas api");
fluffy.introduce(); // Output: Hai, 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 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!

Prototype Object JavaScript

Anda mungkin bertanya-tanya, "Apa itu hal prototype ini yang kita gunakan?" Well, bayangkan itu seperti tas bergantung yang semua objek yang diciptakan dari konstruktor yang sama membawabuat. 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 bergantung ini. Ini lebih hemat memori daripada menambahkannya langsung ke setiap objek, khususnya ketika kita memiliki banyak objek.

Ini adalah representasi visual:

Konstruktor MagicalPet
|
v
Prototype (Tas Bergantung)
- age
- birthday()
|
v
Individual MagicalPet Objects
- name
- species
- specialPower
- introduce()

Konstruktor Object Bawaan di JavaScript

JavaScript datang dengan beberapa konstruktor objek bawaan yang Anda akan sering gunakan dalam perjalanan pemrograman 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 konstruktor ini tersedia, perlu dicatat bahwa untuk tipe primitif seperti string, number, dan boolean, lebih umum dan efisien untuk menggunakan liter:

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() sering digunakan seperti yang ditunjukkan:

let birthday = new Date("1990-01-01");
console.log(birthday.getFullYear()); // Output: 1990

Dan itu saja, teman-teman pemrogram muda! Kita telah melakukan perjalanan melalui realm Konstruktor Object JavaScript, menambahkan properti dan metode ajaib, menjelajahi prototype yang mistis, dan bahkan melihat beberapa konstruktor bawaan.

Ingat, latihan membuat sempurna. Cobalah membuat konstruktor Anda sendiri, mungkin untuk jenis lainnya sihir atau makhluk ajaib. Semakin Anda bermain dengan konsep ini, semakin alami mereka akan menjadi.

Terus kode, terus belajar, dan yang paling penting, terus bersenang-senang! Sampai pelajaran berikutnya, semoga kode Anda bebas bug dan waktu kompilasi Anda cepat!

Credits: Image by storyset