Class dan OOP di JavaScript: Membuat Class, Constructor, dan Inheritance

Dalam pengembangan aplikasi modern, salah satu cara untuk menulis kode yang terstruktur, mudah dikelola, dan efisien adalah dengan menggunakan paradigma Object-Oriented Programming (OOP). JavaScript, yang dulunya dikenal sebagai bahasa pemrograman berbasis fungsi, kini juga mendukung konsep OOP secara penuh melalui class.

Dengan memahami Class dan OOP di JavaScript, kamu dapat membangun program yang lebih modular dan mudah dikembangkan. Konsep seperti constructor dan inheritance memungkinkan kamu untuk menciptakan objek dengan karakteristik dan perilaku yang saling berhubungan, mirip seperti dunia nyata. Pendekatan ini sering digunakan dalam framework besar seperti React, Vue, dan Node.js.

Apa Itu Class di JavaScript?

Class adalah cetak biru (blueprint) untuk membuat objek. Ia menentukan bagaimana sebuah objek akan berperilaku, serta properti dan metode apa saja yang dimilikinya.

Sebelum ES6, JavaScript menggunakan fungsi constructor untuk membuat objek. Namun sekarang, kita bisa menggunakan sintaks class yang lebih rapi dan mudah dibaca.

Contoh sederhana:

class Kendaraan {
  constructor(nama, roda) {
    this.nama = nama;
    this.roda = roda;
  }

  info() {
    return `${this.nama} memiliki ${this.roda} roda.`;
  }
}

const mobil = new Kendaraan('Mobil', 4);
console.log(mobil.info());

Penjelasan:

• constructor() adalah fungsi khusus yang otomatis dijalankan ketika objek dibuat.

• this mengacu pada objek yang sedang dibuat.

• info() adalah metode (fungsi di dalam class).

Membuat Constructor

Constructor berfungsi untuk menginisialisasi nilai awal dari objek yang dibuat menggunakan class. Kamu bisa menambahkan parameter agar setiap objek memiliki nilai berbeda.

class Produk {
  constructor(nama, harga) {
    this.nama = nama;
    this.harga = harga;
  }

  tampilkanInfo() {
    console.log(`Produk: ${this.nama}, Harga: Rp${this.harga}`);
  }
}

const sabun = new Produk('Sabun Mandi', 5000);
const shampoo = new Produk('Shampoo', 12000);

sabun.tampilkanInfo();
shampoo.tampilkanInfo();

Hasil:

Produk: Sabun Mandi, Harga: Rp5000
Produk: Shampoo, Harga: Rp12000

Dengan constructor, setiap kali kamu membuat objek baru, properti otomatis diisi tanpa menulis ulang kode.

Konsep Inheritance (Pewarisan)

Inheritance adalah konsep di mana sebuah class dapat mewarisi properti dan metode dari class lain. Hal ini memungkinkan kode menjadi lebih efisien karena tidak perlu menulis ulang fungsi yang sama di beberapa tempat.

Contoh:

class Kendaraan {
  constructor(nama, roda) {
    this.nama = nama;
    this.roda = roda;
  }

  jalan() {
    console.log(`${this.nama} sedang berjalan di jalan raya.`);
  }
}

// Subclass
class Mobil extends Kendaraan {
  constructor(nama, roda, bahanBakar) {
    super(nama, roda); // memanggil constructor class induk
    this.bahanBakar = bahanBakar;
  }

  isiBahanBakar() {
    console.log(`${this.nama} diisi dengan ${this.bahanBakar}.`);
  }
}

const avanza = new Mobil('Avanza', 4, 'Bensin');
avanza.jalan();
avanza.isiBahanBakar();

Penjelasan:

• extends digunakan untuk membuat class turunan dari class induk.

• super() digunakan untuk memanggil constructor dari class induk.

• Class Mobil mewarisi semua metode dari class Kendaraan.

Manfaat Menggunakan Class dan OOP di JavaScript

1. Kode lebih terstruktur dan rapi
   Dengan class, kamu bisa memisahkan logika ke dalam unit kecil yang mudah dipahami.

2. Mudah dikelola dan dikembangkan
   Jika ada perubahan, cukup ubah satu class tanpa merusak keseluruhan sistem.

3. Reuse kode (DRY Principle)
   Dengan inheritance, kamu bisa menggunakan kembali logika dari class lain.

4. Cocok untuk proyek besar
   Framework seperti React dan Angular menggunakan pendekatan berbasis class dan OOP.

Studi Kasus: Aplikasi Manajemen Pegawai

Mari kita lihat contoh penerapan Class dan OOP di JavaScript untuk aplikasi kecil pengelolaan pegawai:

class Pegawai {
  constructor(nama, jabatan) {
    this.nama = nama;
    this.jabatan = jabatan;
  }

  info() {
    return `${this.nama} menjabat sebagai ${this.jabatan}`;
  }
}

class Manajer extends Pegawai {
  constructor(nama, jabatan, departemen) {
    super(nama, jabatan);
    this.departemen = departemen;
  }

  rapat() {
    return `${this.nama} sedang memimpin rapat di departemen ${this.departemen}`;
  }
}

const pegawai1 = new Pegawai('Dina', 'Staff Keuangan');
const manajer1 = new Manajer('Budi', 'Manajer', 'Marketing');

console.log(pegawai1.info());
console.log(manajer1.info());
console.log(manajer1.rapat());

Output:

Dina menjabat sebagai Staff Keuangan
Budi menjabat sebagai Manajer
Budi sedang memimpin rapat di departemen Marketing

Pengembangan Lebih Lanjut

Setelah memahami class, constructor, dan inheritance, kamu bisa mengembangkan konsep ini ke tahap lebih kompleks seperti:

• Encapsulation: menyembunyikan detail implementasi dengan private fields (#)

• Polymorphism: membuat metode yang bisa berperilaku berbeda tergantung konteksnya

• Static Method: membuat metode yang bisa dipanggil tanpa membuat objek

Contoh:

class MathHelper {
  static tambah(a, b) {
    return a + b;
  }
}

console.log(MathHelper.tambah(10, 5)); // Output: 15

Kesimpulan

Dengan memahami Class dan OOP di JavaScript, kamu dapat menulis kode yang lebih bersih, terstruktur, dan mudah dikembangkan untuk jangka panjang. Konsep seperti constructor dan inheritance bukan hanya membantu dalam efisiensi penulisan kode, tetapi juga memudahkan kolaborasi dalam tim pengembang.

Mulailah menerapkan konsep OOP ini dalam proyek kecil seperti manajemen data atau aplikasi sederhana. Seiring waktu, kamu akan terbiasa berpikir secara objektif dan logis, layaknya seorang pengembang profesional JavaScript modern.