Menjadikan SOLID Mudah: Panduan JavaScript untuk Membersihkan Prinsip Kod

Apabila saya mula terjun ke dunia pembangunan perisian, saya sering mendapati diri saya terharu dengan semua kata kunci dan konsep yang berterbangan. Salah satu konsep yang kelihatan sangat menakutkan ialah prinsip SOLID. Rasanya seperti sesuatu yang hanya perlu dibimbangkan oleh pembangun "serius". Tetapi apabila saya semakin selesa dengan pengekodan, saya menyedari bahawa prinsip ini kurang tentang menjadi mewah dan lebih kepada menulis kod yang tidak membuatkan anda mahu menarik rambut anda selepas beberapa bulan.

Jadi, inilah pandangan saya tentang prinsip SOLID dalam JavaScript—panduan praktikal yang tidak masuk akal yang saya harap saya miliki semasa saya mula.

1. Prinsip Tanggungjawab Tunggal (SRP): Satu Kerja, Selesai Dengan Baik

Apa itu?

Prinsip Tanggungjawab Tunggal menyatakan bahawa kelas seharusnya hanya mempunyai satu sebab untuk berubah, bermakna kelas itu harus mempunyai satu pekerjaan atau tanggungjawab sahaja.

Analogi Kehidupan Sebenar

Fikirkan seorang barista di kedai kopi kegemaran anda. Tugas mereka adalah membuat kopi. Jika tiba-tiba mereka terpaksa mula membetulkan mesin espresso, menghidangkan pastri dan membuang sampah, keadaan akan menjadi huru-hara. Sama seperti cara barista harus menumpukan pada membuat kopi, kelas anda harus menumpukan pada melakukan satu perkara dengan baik.

Contoh dalam JavaScript:

Bayangkan anda mempunyai kelas Pengguna yang mengendalikan pengesahan pengguna, pengesahan data dan storan pangkalan data. Ia melakukan terlalu banyak! Dengan membahagikan tanggungjawab ini kepada kelas yang berasingan, anda menjadikan kod anda lebih mudah untuk diurus dan diselenggara.

class UserAuthenticator {
  login(user) {
    // handle login
  }
}

class UserDataValidator {
  validate(user) {
    // validate user data
  }
}

class UserDatabase {
  save(user) {
    // save user to the database
  }
}

2. Prinsip Terbuka/Tertutup (OCP): Panjangkan, Jangan Ubah Suai

Apa itu?

Prinsip Terbuka/Tertutup menyatakan bahawa entiti perisian harus dibuka untuk sambungan tetapi ditutup untuk pengubahsuaian. Dalam erti kata lain, anda sepatutnya boleh menambah fungsi baharu tanpa menukar kod sedia ada.

Analogi Kehidupan Sebenar:

Bayangkan konsol permainan kegemaran anda. Anda boleh menambah permainan, pengawal dan aksesori baharu, tetapi anda tidak perlu membukanya dan mengaitkannya semula untuk berbuat demikian. Begitu juga, anda sepatutnya boleh menambah ciri baharu pada kod anda tanpa mengubah struktur terasnya.

Contoh dalam JavaScript:

Katakan anda mempunyai kelas Shape dengan kaedah untuk mengira luas. Jika anda perlu menambah bentuk baharu, seperti segi tiga, anda tidak sepatutnya mengubah suai kelas sedia ada. Sebaliknya, lanjutkan.

class Shape {
  area() {
    throw "Area method not implemented";
  }
}

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

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

class Circle extends Shape {
  constructor(radius) {
    super();
    this.radius = radius;
  }

  area() {
    return Math.PI * this.radius * this.radius;
  }
}

3. Prinsip Penggantian Liskov (LSP): Pastikan Ia Boleh Digantikan

Apa itu?

Prinsip Penggantian Liskov menyatakan bahawa objek superclass harus diganti dengan objek subclass tanpa menjejaskan ketepatan program.

Analogi Kehidupan Sebenar:

Bayangkan menyewa kereta. Sama ada anda mendapatkan sedan atau SUV, anda mengharapkan ia mempunyai fungsi asas kereta: ia harus memandu, mengemudi dan berhenti. Jika kereta sewa anda memerlukan set kawalan yang berbeza, anda akan menghadapi masalah! Begitu juga, subkelas hendaklah berkelakuan dengan cara yang tidak melanggar jangkaan yang ditetapkan oleh kelas induknya.

Contoh dalam JavaScript:

Jika anda mempunyai kelas Burung dan kelas Penguin yang memanjangkannya, Penguin harus tetap berkelakuan seperti Burung walaupun ia tidak boleh terbang. Ia sepatutnya masih berjalan, makan, dan mungkin juga berenang.

class Bird {
  move() {
    console.log("Flies in the sky");
  }
}

class Penguin extends Bird {
  move() {
    console.log("Swims in the water");
  }
}

const myBird = new Bird();
const myPenguin = new Penguin();

myBird.move(); // Flies in the sky
myPenguin.move(); // Swims in the water

4. Prinsip Pengasingan Antara Muka (ISP): Antara Muka Dibuat Khusus

Apa itu?

Prinsip Pengasingan Antara Muka mencadangkan bahawa pelanggan tidak boleh dipaksa untuk melaksanakan antara muka yang mereka tidak gunakan. Daripada mempunyai satu antara muka yang besar, anda harus mencipta antara muka yang lebih kecil dan lebih khusus.

Analogi Kehidupan Sebenar:

Bayangkan restoran di mana chef juga perlu menjadi pelayan, pelayan bar dan mesin basuh pinggan mangkuk. Ia sangat menggembirakan dan tidak cekap! Sebaliknya, setiap peranan harus mempunyai tugas tertentu. Begitu juga, antara muka anda haruslah khusus dan fokus.

Contoh dalam JavaScript:

Jika anda mempunyai antara muka Pekerja yang merangkumi kaedah seperti buildHouse, paintHouse dan designHouse, pekerja yang hanya mengecat rumah tidak sepatutnya melaksanakan semua kaedah lain. Pecahkannya kepada antara muka yang lebih kecil.

class Builder {
  build() {
    console.log("Building house...");
  }
}

class Painter {
  paint() {
    console.log("Painting house...");
  }
}

class Designer {
  design() {
    console.log("Designing house...");
  }
}

5. Prinsip Inversi Ketergantungan (DIP): Bergantung pada Abstraksi

Apa itu?

Prinsip Pembalikan Ketergantungan menyatakan bahawa modul peringkat tinggi tidak boleh bergantung pada modul peringkat rendah. Kedua-duanya harus bergantung pada abstraksi.

Real-Life Analogy:

Think about how you plug your phone charger into a wall socket. You don’t need to know the details of the electrical wiring inside the walls—all you need is the interface (the socket) to power your device. Similarly, your code should depend on abstractions (interfaces), not concrete implementations.

Example in JavaScript:

If you have a LightBulb class that directly controls a Switch class, you’re creating a tight coupling. Instead, both should depend on an interface like PowerSource.

class LightBulb {
  turnOn(powerSource) {
    powerSource.provideElectricity();
    console.log("Light is on");
  }
}

class Switch {
  constructor(powerSource) {
    this.powerSource = powerSource;
  }

  operate() {
    this.powerSource.togglePower();
  }
}

class PowerSource {
  provideElectricity() {
    console.log("Providing electricity");
  }

  togglePower() {
    console.log("Toggling power");
  }
}

Conclusion

Mastering the SOLID principles is like learning to cook with a set of proven recipes. Once you understand them, you can whip up code that’s not just functional but elegant and easy to maintain. So next time you find yourself in a coding conundrum, remember: there’s a principle for that!

Happy coding! ?

Atas ialah kandungan terperinci Menjadikan SOLID Mudah: Panduan JavaScript untuk Membersihkan Prinsip Kod. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!