Object-Oriented Programming (OOP) adalah paradigma pemrograman yang mengorganisir kode menjadi struktur logis yang disebut object. Dengan hadirnya ES6, JavaScript sepenuhnya mengadopsi OOP melalui sintaks class, membuatnya lebih mudah untuk menulis dan mengelola aplikasi kompleks. Dalam panduan ini, kita akan menjelajahi cara memanfaatkan JavaScript classes untuk menulis kode yang bersih, modular, dan efisien.

Mengapa OOP di JavaScript?

OOP membantu:

  • Mengenkapsulasi data dan perilaku ke dalam object
  • Menggunakan ulang kode melalui inheritance
  • Struktur codebase besar untuk skalabilitas
  • Menyederhanakan debugging dan testing

Meskipun JavaScript berbasis prototype, ES6 classes menyediakan syntactic sugar di atas prototype, menawarkan struktur OOP yang familiar untuk developer dari bahasa seperti Java atau C++.

1. Dasar-dasar ES6 Classes

Mendeklarasikan Class

Gunakan keyword class untuk mendefinisikan blueprint object:

javascript 
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  // Method
  greet() {
    return `Halo, saya ${this.name}!`;
  }
}

const alice = new Person("Alice", 30);
console.log(alice.greet()); // "Halo, saya Alice!"

Constructor

Method constructor menginisialisasi properti object ketika instance baru dibuat dengan new.

2. Inheritance dengan extends dan super

Gunakan extends untuk membuat subclass yang mewarisi dari parent class:

javascript 
class Student extends Person {
  constructor(name, age, major) {
    super(name, age); // Memanggil constructor parent
    this.major = major;
  }

  study() {
    return `${this.name} sedang belajar ${this.major}.`;
  }
}

const bob = new Student("Bob", 22, "Ilmu Komputer");
console.log(bob.greet()); // "Halo, saya Bob!"
console.log(bob.study()); // "Bob sedang belajar Ilmu Komputer."
  • super() memanggil constructor class parent
  • Subclass dapat meng-override method parent

3. Static Methods dan Properties

Static members milik class itu sendiri, bukan instance:

javascript 
class MathUtils {
  static PI = 3.14159;

  static square(x) {
    return x * x;
  }
}

console.log(MathUtils.square(5)); // 25
console.log(MathUtils.PI); // 3.14159

4. Getters dan Setters

Kontrol akses ke properti menggunakan get dan set:

javascript 
class BankAccount {
  constructor(balance) {
    this._balance = balance;
  }

  get balance() {
    return this._balance;
  }

  set balance(amount) {
    if (amount < 0) throw new Error("Saldo tidak boleh negatif!");
    this._balance = amount;
  }
}

const account = new BankAccount(100);
account.balance = 200; // Menggunakan setter
console.log(account.balance); // 200

5. Private Fields

Gunakan # untuk mendefinisikan private fields (enkapsulasi):

javascript 
class Employee {
  #salary;

  constructor(name, salary) {
    this.name = name;
    this.#salary = salary;
  }

  getSalary() {
    return this.#salary;
  }
}

const emp = new Employee("John", 50000);
console.log(emp.getSalary()); // 50000
console.log(emp.#salary); // Error: Private field

6. Contoh: Membangun Game Sederhana

Mari buat mini-game dengan classes:

javascript 
class Character {
  constructor(name, health) {
    this.name = name;
    this.health = health;
  }

  attack() {
    return `${this.name} menyerang!`;
  }
}

class Mage extends Character {
  constructor(name, health, mana) {
    super(name, health);
    this.mana = mana;
  }

  castSpell() {
    if (this.mana > 0) {
      this.mana -= 10;
      return `${this.name} melemparkan fireball!`;
    }
    return "Mana habis!";
  }
}

const merlin = new Mage("Merlin", 100, 50);
console.log(merlin.attack()); // "Merlin menyerang!"
console.log(merlin.castSpell()); // "Merlin melemparkan fireball!"

7. Best Practices untuk OOP JavaScript

  1. Favor Composition Over Inheritance: Gunakan object dalam class daripada rantai inheritance yang dalam
  2. Gunakan Private Fields: Lindungi state internal dengan #
  3. Manfaatkan Static Methods: Untuk fungsi utility yang terkait dengan class
  4. Override Methods dengan Bijak: Pastikan perilaku subclass selaras dengan parent class
  5. Gunakan Nama yang Deskriptif: Untuk class, method, dan properti

Kapan Menggunakan OOP di JavaScript?

  • Membangun komponen UI kompleks (contoh: React class components)
  • Memodelkan entitas dunia nyata (contoh: user, product, order)
  • Structuring kode server-side dengan Node.js
  • Aplikasi enterprise yang membutuhkan maintainability tinggi

Kelebihan OOP dengan ES6 Classes

✅ Kode Lebih Terorganisir - Logical grouping yang jelas
✅ Reusability - Mudah menggunakan ulang kode dengan inheritance
✅ Maintainability - Perubahan lebih mudah dan terisolasi
✅ Team Collaboration - Standar yang konsisten untuk tim
✅ Scalability - Struktur yang mendukung pertumbuhan aplikasi

Kesimpulan

ES6 classes membawa kekuatan OOP ke JavaScript, memungkinkan developer untuk menulis kode yang terorganisir, reusable, dan scalable. Dengan menguasai classes, inheritance, dan encapsulation, Kamu akan siap untuk menghadapi tantangan JavaScript modern dengan percaya diri.

Mulailah mengintegrasikan OOP dalam projectmu hari ini, dan lihat bagaimana kode berevolusi dari script sederhana menjadi aplikasi terstruktur!

Tips untuk Belajar Lebih Lanjut:

  • Praktekkan dengan project kecil
  • Pelajari design patterns OOP
  • Eksplor framework yang menggunakan OOP seperti Angular

Semoga panduan ini membantu perjalanan belajar OOP JavaScript! 🚀