Rumah > hujung hadapan web > tutorial js > [Bahagian Pengenalan Ringkas kepada SOLID Typescript

[Bahagian Pengenalan Ringkas kepada SOLID Typescript

DDD
Lepaskan: 2024-12-31 05:08:09
asal
971 orang telah melayarinya

[Part A Brief Introduction to SOLID Typescript

I - Prinsip Pengasingan Antara Muka (ISP)

Pelanggan tidak boleh dipaksa untuk melaksanakan antara muka yang mereka tidak gunakan.

Ini bermakna antara muka hendaklah kecil dan khusus untuk keperluan kelas pelaksana.
Sebagai Contoh:

❌Teruk

interface Work{
    eat(): void;
    work(): void;
}

class Developer implements Work{
    eat() {
        console.log("eat");
    }
    work() {
        console.log("work");
    }
}
class Robot implements Work{
    eat() {
        throw new Error("eat"); // Robot does not need to inherit eat() method
    }
    work() {
        console.log("work");
    }
}
Salin selepas log masuk

✅Baik

interface Workable  {
    work(): void;
}
interface Eatable {
    eat(): void;
}
class Developer implements Workable, Eatable {
    eat() {}

    work(): void {
    }
}
Salin selepas log masuk

Berdasarkan kekuatan antara muka, satu kelas boleh melaksanakan berbilang antara muka. Anda harus memecahkan antara muka kepada bahagian yang lebih kecil agar lebih sesuai dengan keperluan kelas anda


D - Prinsip Penyongsangan Ketergantungan (DIP)

*Modul peringkat tinggi tidak boleh bergantung pada modul peringkat rendah. Kedua-duanya harus bergantung pada abstraksi.
*

Prinsip ini menggalakkan penggunaan suntikan pergantungan
Sebagai Contoh:

❌Teruk

class BackendDeveloper {
    develop(){
        console.log("Developing developer");
    }
}
class FrontendDeveloper {
    develop(){
        console.log("FrontendDeveloper");
    }
}
class Project {
    backendDeveloper: BackendDeveloper;
    frontendDeveloper: FrontendDeveloper;
    constructor() {
        this.backendDeveloper = new BackendDeveloper();
        this.frontendDeveloper = new FrontendDeveloper();
    }
    build(){
        this.backendDeveloper.develop();
        this.frontendDeveloper.develop();
    }
}
Salin selepas log masuk

Dalam coretan kod, terdapat berbilang masalah. Walau bagaimanapun, masalah paling penting yang anda boleh lihat ialah:

  • Jika anda ingin menambah MobileDeveloper(), anda perlu mengubah suai Project() yang akan memberi kesan kepada kaedah lain yang menggunakannya
  • Project() adalah berpasangan rapat dengan backendDeveloper dan frontendDeveloper

✅Baik

interface Developer {
    developer(): void
}
class BackendDev implements Developer {
    developer() {
        console.log("Developer Developer");
    }
}
class FrontendDeveloper implements Developer {
    developer() {
        console.log("Developer Developer");
    }
}
class Project {
    constructor(private developers: Developer[]) {
    }
    build(){
        this.developers.forEach(developer => {developer.developer();});
    }
}

Salin selepas log masuk

Modul peringkat tinggi bergantung pada abstraksi (antara muka Pembangun).
Modul peringkat rendah melaksanakan abstraksi.
Gandingan yang longgar menjadikannya mudah untuk dipanjangkan dan diselenggara.

Menambah MobileDev:

class MobileDeveloper implements Developer {
  develop() {
    console.log("Writing mobile code");
  }
}

// Usage
const developers: Developer[] = [
  new BackendDeveloper(),
  new FrontendDeveloper(),
  new MobileDeveloper(), //easy to add and make it does not change in Project()
];
const project = new Project(developers);
project.build();

Salin selepas log masuk

Terima Kasih :)))

Atas ialah kandungan terperinci [Bahagian Pengenalan Ringkas kepada SOLID Typescript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan