Pengenalan kepada corak penghias corak reka bentuk JavaScript

Pengenalan kepada corak penghias corak reka bentuk JavaScript_kemahiran javascript

WBOY

Lepaskan： 2016-05-16 16:24:03

asal

1024 orang telah melayarinya

Penerangan Corak Penghias

Penjelasan: Gunakan satu kelas untuk mengubah suai secara dinamik objek fungsi kelas lain sebelum atau selepas, dan menambah beberapa fungsi tambahan padanya; ini ialah hiasan fungsi objek kelas, dan kelas yang dihias berkaitan dengan yang dihias kelas Kelas dikehendaki mempunyai kaedah antara muka akses yang sama (fungsi) Dalam kelas berorientasikan objek dinamik, pelaksanaan biasanya dikekang dengan melaksanakan antara muka yang sama mesti mempunyai rujukan kepada kelas yang dihias, yang digunakan dalam The sepadan; kaedah kelas berhias memanggil kaedah kelas berhias yang sepadan dan kemudian mengubahnya

Contoh senario:

1>. Contohnya, pakaian yang kita pakai dalam kehidupan ialah baju, jaket sut, seluar, tali leher, dan sepasang kasut kulit yang cantik dipakai adalah hiasan untuk bahagian hadapan atau seluruh badan ;

2> Sebagai contoh, kami mempunyai kaedah berfungsi di bawah kelas, yang boleh digunakan untuk menulis log atau untuk log masuk pengguna Mungkin perlu untuk mendapatkan maklumat pengendali semasa sebelum menulis log, atau selepas log masuk berjaya, tulis Masukkan log; operasi tambahan sebelum menulis log adalah tujuan menulis log selepas log masuk berjaya secara amnya adalah maklumat operasi proses log masuk;

Oleh itu, corak penghias digunakan untuk melaksanakan senario di mana kedua-duanya mempunyai operasi yang serupa;

Contoh kod sumber

1. Kelas penghias

Salin kod Kod adalah seperti berikut:

fungsi Pakai() {

}

Wear.prototype.Shirt = function() { //Memakai baju

console.log('pakai baju');
}

2. Kelas penghias

Salin kod Kod adalah seperti berikut:

fungsi Penghias(pakai) {

This.wear = pakai;
}

Decorator.prototype.Shirt = function() { This.wear.Shirt();

//Selepas memakai baju, saya menambah tali leher
}

3. Cara menggunakan

Salin kod Kod adalah seperti berikut:

var wear = new Wear();

var decorator = Penghias baharu(pakaian);

penghias.Baju();

Dengan cara ini, hiasan lanjutan dinamik objek fungsi baju Wear direalisasikan Anda tidak perlu tahu cara kaedah hiasan asal dilaksanakan Anda hanya perlu mengetahui fungsinya, dan kemudian tahu apa yang kami mahu menambahnya apa sahaja fungsi tambahannya;

Arahan lain

Corak penghias benar-benar merangkumi pendekatan berorientasikan objek: prinsip terbuka kepada sambungan dan tertutup kepada pengubahsuaian; semua kaedah fungsi yang diingini dilaksanakan tanpa mengubah suai [Pakaian kelas berhias] dan melanjutkan Penghias [kelas penghias]] ;

Salah satu ciri utama corak penghias ialah penghias merujuk objek yang dihias untuk mencapai hiasan yang tidak diubah suai bagi objek yang dihias;

Simulasi: Mula-mula pakai baju, kemudian tali leher, kemudian sut: Orang yang dihias di atas kekal tidak berubah:

2. Kelas penghias:

Salin kod

Kod adalah seperti berikut: fungsi Penghias(pakai) { This.wear = pakai;

}

Decorator.prototype.Shirt = function() {

This.wear.Shirt(); //Hanya pakai baju di sini;

}

3 Buat kelas seri dan kelas sut yang mewarisi subkelas Penghias

Salin kod

Kod adalah seperti berikut:

fungsi Penghias_Ikat(penghias) {
This.decorator = penghias;
}
Decorator_Tie.prototype.Shirt = function() {
This.decorator.Shirt(); //Pakai baju
console.log('Pakaikan tali leher anda sekali lagi');
}

fungsi Penghias_Barat (penghias) {
This.decorator = penghias;
}
Decorator_Western.prototype.Shirt = function() {
This.decorator.Shirt();
console.log('Pakai semula saman itu');
}

Penggunaan:

Salin kod Kod adalah seperti berikut:

//Pakai baju dulu

var wear = new Wear();

var decorator = Penghias baharu(pakaian);

//decorator.Baju();

//Pakai tali leher anda sekali lagi

var tie = penghias_tali baru(penghias);

//tie.Baju();

//Pakai semula saman itu

var western = new Decorator_Western(tali leher);

barat.Baju();

Ini adalah contoh simulasi memakai pakaian dan hiasan