Panduan Pemula untuk Kelas JavaScript

Hai teman-teman, sang pelajar JavaScript masa depan! Hari ini, kita akan memulai perjalanan menarik ke dunia kelas-kelas JavaScript. Jangan khawatir jika Anda belum pernah menulis baris kode sebelumnya – saya akan menjadi panduan ramah Anda, dan kita akan bergerak langkah demi langkah. Pada akhir panduan ini, Anda akan dapat membuat kelas Anda sendiri seperti seorang ahli!

JavaScript - Classes

Apa Itu Kelas JavaScript?

Bayangkan Anda sedang membangun sebuah kebun binatang virtual. Anda tentu tidak mau menggambarkan setiap hewan secara individual, kan? Itulah tempat kelas-kelas berguna. Sebuah kelas adalah seperti blueprint untuk membuat objek. Itu menentukan properti dan perilaku yang semua objek jenis itu harus memiliki.

Mari kita mulai dengan contoh sederhana:

class Animal {
constructor(name, species) {
this.name = name;
this.species = species;
}

makeSound() {
console.log("The animal makes a sound");
}
}

Dalam contoh ini, Animal adalah kelas kita. Itu seperti mengatakan, "Setiap hewan di kebun binatang kita akan memiliki nama, jenis, dan kemampuan untuk membuat suara."

Mendefinisikan Kelas JavaScript

Untuk mendefinisikan kelas di JavaScript, kita gunakan kata kunci class diikuti dengan nama kelas. Nama kelas biasanya dimulai dengan huruf besar – itu bukan wajib, tapi itu adalah konvensi umum yang membantu membedakan kelas dari jenis kode lain.

Metode constructor()

Metode constructor() adalah metode khusus untuk membuat dan menginisialisasi objek yang dibuat dengan kelas. Itu dipanggil secara otomatis saat kita membuat objek baru dari kelas ini.

class Book {
constructor(title, author, year) {
this.title = title;
this.author = author;
this.year = year;
}
}

Di sini, title, author, dan year adalah properti yang setiap objek Book akan memiliki. Kata kunci this merujuk ke objek yang sedang diciptakan.

Membuat Objek JavaScript

Sekarang kita memiliki kelas kita, mari kita buat beberapa objek!

let myBook = new Book("The Great Gatsby", "F. Scott Fitzgerald", 1925);
console.log(myBook.title); // Keluaran: The Great Gatsby

Kata kunci new digunakan untuk membuat instance baru dari kelas Book. Itu seperti mengatakan, "Hey JavaScript, tolong buatkan saya buku baru menggunakan blueprint ini!"

Metode Kelas JavaScript

Metode adalah fungsi yang milik kelas. Mereka menentukan perilaku yang objek kelas dapat melaksanakan.

class Dog {
constructor(name) {
this.name = name;
}

bark() {
console.log(`${this.name} says: Woof woof!`);
}

fetch(item) {
console.log(`${this.name} fetches the ${item}`);
}
}

let myDog = new Dog("Buddy");
myDog.bark(); // Keluaran: Buddy says: Woof woof!
myDog.fetch("ball"); // Keluaran: Buddy fetches the ball

Dalam contoh ini, bark() dan fetch() adalah metode kelas Dog. Setiap objek Dog yang kita buat akan memiliki kemampuan ini.

Jenis Kelas JavaScript

JavaScript mendukung dua jenis utama kelas:

  1. Deklarasi: Ini adalah apa yang kita gunakan sejauh ini.

    class Rectangle {
    // body kelas
    }
  2. Ekspresi: Kelas juga dapat didefinisikan dalam ekspresi.

    let Rectangle = class {
    // body kelas
    };

Kedua-duanya mencapai hasil yang sama, tapi deklarasi kelas lebih umum dan mudah dibaca.

Hoisting Kelas JavaScript

Tidak seperti deklarasi fungsi, deklarasi kelas tidak dihoist. Ini berarti Anda tidak dapat menggunakan kelas sebelum itu didefinisikan dalam kode Anda.

// Ini akan melempar kesalahan
let p = new Rectangle(); // ReferenceError

class Rectangle {}

Selalu definisikan kelas Anda sebelum Anda menggunakannya!

Mode Ketat dengan Kelas

Ini adalah fakta menarik: tubuh kelas selalu dieksekusi dalam mode ketat. Apa artinya ini? Well, itu seperti memiliki guru ketat yang tidak membiarkan Anda membuat kode kotor. Sebagai contoh:

class StrictClass {
method() {
undeclaredVariable = 5; // Ini akan melempar kesalahan
}
}

Dalam mode ketat, Anda harus mendeklarasikan variabel Anda sebelum menggunakannya. Itu membantu menangkap kesalahan pemrograman umum dan menjaga kode Anda bersih!

Tabel Metode Kelas

Ini adalah tabel praktis dari beberapa metode kelas umum:

Metode Deskripsi
constructor() Menginisialisasi instance baru kelas
static Mendefinisikan metode statis untuk kelas
extends Membuat kelas sebagai anak dari kelas lain
super Memanggil kontruktur kelas induk
get Mendefinisikan metode pengambil
set Mendefinisikan metode pengatur

Kesimpulan

Selamat! Anda baru saja mengambil langkah pertama ke dunia kelas-kelas JavaScript. Ingat, seperti belajar keterampilan baru, latihan membuat sempurna. Cobalah membuat kelas Anda sendiri – mungkin Car kelas dengan metode seperti startEngine() dan drive(), atau Superhero kelas dengan metode useSpecialPower().

Kelas-kelas adalah alat yang kuat di JavaScript, memungkinkan Anda menciptakan kode yang terorganisir dan dapat digunakan kembali. Mereka seperti blok Lego pemrograman – sederhana sendiri, tapi mampu membangun hal yang menakjubkan saat digabungkan.

Terus kode, terus belajar, dan sebelum Anda tahu, Anda akan dapat membuat aplikasi kompleks dengan mudah. Selamat belajar, para pengembang masa depan!

Credits: Image by storyset