Menguasai Kelas JavaScript: Panduan Lengkap untuk OOP Moden

Memahami Kelas JavaScript

Kelas JavaScript ialah gula sintaksis atas sistem pewarisan prototaipnya. Diperkenalkan dalam ES6, kelas menyediakan cara yang jelas dan berstruktur untuk mentakrifkan objek dan berfungsi dengan warisan dalam JavaScript, menjadikan kod lebih mudah dibaca dan teratur.

---

Mentakrifkan Kelas

Anda boleh menentukan kelas menggunakan kata kunci kelas.

Contoh:

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

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

const person1 = new Person("Alice", 25);
person1.greet(); // Hello, my name is Alice and I am 25 years old.

---

Ciri Utama Kelas

1. Kaedah Pembina: Pembina ialah kaedah khas untuk memulakan objek baharu. Ia dipanggil secara automatik apabila contoh baharu kelas dibuat.

Contoh:

   class Car {
     constructor(brand) {
       this.brand = brand;
     }
   }

   const myCar = new Car("Toyota");
   console.log(myCar.brand); // Toyota

1. Kaedah: Fungsi yang ditakrifkan di dalam kelas dipanggil kaedah.

Contoh:

   class Animal {
     sound() {
       console.log("Animal makes a sound");
     }
   }

   const dog = new Animal();
   dog.sound(); // Animal makes a sound

1. Kaedah Statik: Kaedah yang ditakrifkan dengan kata kunci statik adalah milik kelas itu sendiri, bukan contoh kelas.

Contoh:

   class MathUtils {
     static add(a, b) {
       return a + b;
     }
   }

   console.log(MathUtils.add(3, 5)); // 8

1. Pengambil dan Penetap: Kaedah khas untuk mengakses dan mengubah suai sifat.

Contoh:

   class Rectangle {
     constructor(width, height) {
       this.width = width;
       this.height = height;
     }

     get area() {
       return this.width * this.height;
     }
   }

   const rect = new Rectangle(10, 5);
   console.log(rect.area); // 50

---

Warisan dalam Kelas

Warisan membolehkan kelas memperoleh sifat dan kaedah daripada kelas lain menggunakan kata kunci lanjutan.

Contoh:

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

  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

class Dog extends Animal {
  speak() {
    console.log(`${this.name} barks.`);
  }
}

const dog = new Dog("Rex");
dog.speak(); // Rex barks.

---

Bidang dan Kaedah Persendirian

Medan dan kaedah peribadi, yang diperkenalkan dalam ES2022, bermula dengan # dan tidak boleh diakses di luar kelas.

Contoh:

class BankAccount {
  #balance;

  constructor(initialBalance) {
    this.#balance = initialBalance;
  }

  deposit(amount) {
    this.#balance += amount;
    console.log(`Deposited: ${amount}`);
  }

  getBalance() {
    return this.#balance;
  }
}

const account = new BankAccount(100);
account.deposit(50); // Deposited: 50
console.log(account.getBalance()); // 150
// console.log(account.#balance); // Error: Private field '#balance' must be declared in an enclosing class

---

Ungkapan Kelas

Kelas juga boleh ditakrifkan sebagai ungkapan dan diberikan kepada pembolehubah.

Contoh:

const Rectangle = class {
  constructor(width, height) {
    this.width = width;
    this.height = height;
  }

  getArea() {
    return this.width * this.height;
  }
};

const rect = new Rectangle(10, 5);
console.log(rect.getArea()); // 50

---

Bercampur dengan Prototaip

Walaupun kelas adalah gula sintaksis, anda masih boleh menggabungkannya dengan warisan berasaskan prototaip JavaScript.

Contoh:

class Person {}
Person.prototype.sayHello = function () {
  console.log("Hello!");
};

const person = new Person();
person.sayHello(); // Hello!

---

Amalan Terbaik dengan Kelas

1. Encapsulation:
   
   Gunakan medan peribadi untuk melindungi data sensitif.

2. Kebolehgunaan semula:
   
   Manfaatkan warisan untuk menggunakan semula kod merentas berbilang kelas.

3. Elakkan Terlalu Rumit:
   
   Gunakan kelas hanya apabila perlu. Objek atau fungsi mudah mungkin mencukupi untuk tugasan kecil.

4. Ketekalan:
   
   Ikut konvensyen penamaan untuk kaedah dan sifat untuk kebolehbacaan.

---

Kesimpulan

Kelas JavaScript menyediakan cara yang bersih dan cekap untuk mengurus pengaturcaraan berorientasikan objek dalam JavaScript. Dengan ciri seperti pewarisan, kaedah statik, medan peribadi dan enkapsulasi, ia menawarkan alat yang berkuasa untuk menstruktur dan mengurus kod, menjadikannya lebih mudah untuk membina aplikasi berskala dan boleh diselenggara.

Hai, saya Abhay Singh Kathayat!
Saya seorang pembangun timbunan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.
Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.

Atas ialah kandungan terperinci Menguasai Kelas JavaScript: Panduan Lengkap untuk OOP Moden. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!