Apa itu sebuah pola
Saya sedang mempersiapkan ujian akhir beberapa waktu yang lalu, tetapi itu adalah orang yang melelahkan dan saya benar -benar sibuk. Saya tidak punya waktu untuk memperbarui artikel. Hari ini saya akan memberi tahu Anda tentang pola desain di JavaScript.
Pertama-tama, yang perlu kita ketahui adalah pola itu adalah solusi yang dapat digunakan kembali, sementara anti-pola adalah solusi yang buruk untuk masalah tertentu.
Contoh umum anti-pola JS
1. Pass string ke setTimeout dan setInterval, bukan fungsi, yang memicu penggunaan internal eval ().
2. Tentukan sejumlah besar variabel dalam konteks global untuk mencemari namespace global
3. Ubah prototipe kelas objek
4. Gunakan JS Inline, dan kode JS yang tertanam dalam file HTML tidak dapat dimasukkan dalam alat pengujian unit eksternal.
5. Dokumen Penyalahgunaan.Write. Jika Anda menjalankan Document.write setelah halaman dimuat, itu akan menulis ulang halaman tempat kami berada. Jika Anda dapat menggunakan Document.CreateLement sebagai gantinya, cobalah untuk tidak menggunakan Document.write.
Kategori Pola Desain
Menciptakan pola desain
Pola desain kreatif fokus pada penanganan mekanisme pembuatan objek untuk membuat objek dengan cara yang sesuai dengan situasi tertentu. Atribut yang termasuk dalam kategori ini meliputi:
Konstruktor Konstruktor, Pabrik Pabrik, Abstraksi Abstrak, Prototipe Prototipe, Singleton Singleton dan Builder Generator
Pola Desain Struktural
Pola struktural terkait dengan kombinasi objek dan seringkali dapat digunakan untuk menemukan cara sederhana untuk membangun hubungan antara berbagai objek.
Pola yang termasuk dalam kategori ini meliputi:
Dekorator dekorator, penampilan fasad, ensiklopedia kelas terbang, adaptor adaptor dan proxy proxy
Pola Desain Perilaku
Pola perilaku fokus pada peningkatan atau menyederhanakan komunikasi antara berbagai objek dalam sistem.
Pola perilaku meliputi:
Iterator iterator, mediator mediator, pengamat pengamat, dan pengunjung pengunjung
Mode pabrik
Untuk memecahkan masalah beberapa deklarasi objek yang serupa, kita dapat menggunakan metode yang disebut pola pabrik, yaitu untuk menyelesaikan masalah instantiating objek dengan sejumlah besar duplikasi.
Salinan kode adalah sebagai berikut:
<type skrip = "Teks/JavaScript">
function createObject (nama, usia, profesi) {// fungsi instantiated pusat {//
var obj = objek baru ();
obj.name = nama;
obj.age = usia;
obj.profession = profesi;
obj.move = function () {
kembalikan this.name + 'at' + this.age + 'terlibat dalam' + this.profession;
};
kembalikan obj;
}
var test1 = createObject ('trigkit4', 22, 'programmer'); // instance pertama
var test2 = createObject ('mike', 25, 'engineer'); // instance kedua
peringatan (test1.move ());
peringatan (test2.move ());
</script>
Kategori Model Pabrik
Pola pabrik dibagi menjadi pabrik -pabrik sederhana, pabrik abstrak, dan pabrik pintar. Pola pabrik membutuhkan penggunaan konstruktor tanpa menampilkannya.
Pola pabrik sederhana: Gunakan kelas (biasanya monomer) untuk menghasilkan contoh.
Pola Pabrik Kompleks: Gunakan subkelas untuk menentukan contoh kelas spesifik mana variabel anggota seharusnya.
Manfaat model pabrik
Keuntungan utama adalah bahwa ia dapat menghilangkan kopling antar objek dengan menggunakan metode rekayasa alih -alih kata kunci baru. Konsentrasi semua kode yang dipakai di satu tempat untuk mencegah duplikasi kode.
Kerugian dari model pabrik
Sebagian besar kelas paling baik digunakan dengan kata kunci dan konstruktor baru, yang dapat membuat kode lebih mudah dibaca. Alih -alih memeriksa metode pabrik untuk mengetahui.
Pola pabrik memecahkan masalah instantiasi yang berulang, tetapi ada masalah lain, yaitu, mengidentifikasi masalah, karena tidak mungkin untuk mengetahui contoh objek mana mereka.
Salinan kode adalah sebagai berikut:
Peringatan (TypeOf test1); //Obyek
peringatan (test1 instance dari objek); //BENAR
Kapan Menggunakan Mode Pabrik?
Mode pabrik terutama digunakan dalam skenario berikut:
1. Ketika suatu objek atau komponen melibatkan kompleksitas yang tinggi
2. Ketika diperlukan untuk dengan mudah menghasilkan contoh objek yang berbeda sesuai dengan lingkungan yang berbeda di mana mereka berada
3. Ketika berurusan dengan banyak objek atau komponen kecil yang memiliki atribut yang sama
Mode konstruktor
Dalam ecmascript, konstruktor (konstruktor) dapat digunakan untuk membuat objek tertentu. Mode ini hanya dapat menyelesaikan masalah bahwa mode pabrik di atas tidak dapat mengenali instance objek.
Salinan kode adalah sebagai berikut:
<type skrip = "Teks/JavaScript">
Function Car (Model, Year, Miles) {// Mode Konstruktor
this.model = model;
this.year = tahun;
this.miles = mil;
this.run = function () {
kembalikan this.model + "telah dilakukan" + this.miles + "miles";
}
}
var benz = mobil baru ('benz', 2014.20000);
var bmw = mobil baru ("BMW", 2013,12000);
waspada (contoh mobil dari mobil); // Saya dengan jelas mengidentifikasinya sebagai subordinat ke mobil, benar
console.log (benz.run ());
console.log (bmw.run ());
</script>
Menggunakan metode konstruktor memecahkan masalah instantiasi berulang dan masalah pengenalan objek. Perbedaan antara pola ini dan pola pabrik adalah:
1. Buat objek (objek baru ()) yang tidak ditampilkan oleh metode konstruktor;
2. Langsung tetapkan atribut dan metode untuk objek ini;
3. Tidak ada pernyataan pengembalian.
Ada beberapa spesifikasi untuk metode konstruktor:
1. Nama fungsi dan konstruktor yang dipakai adalah sama dan dikapitalisasi (PS: tidak wajib, tetapi menulis ini membantu membedakan antara konstruktor dan fungsi biasa);
2. Untuk membuat objek melalui konstruktor, operator baru harus digunakan.
Karena suatu objek dapat dibuat melalui konstruktor, dari mana objek ini berasal dan dari mana objek baru () dieksekusi? Proses eksekusi adalah sebagai berikut:
1. Ketika konstruktor digunakan dan konstruktor baru () digunakan, maka objek baru () dieksekusi di latar belakang;
2. Lingkup konstruktor ke objek baru (yaitu, objek yang dibuat oleh objek baru ()), dan ini dalam tubuh fungsi mewakili objek yang dihasilkan oleh objek baru ().
3. Jalankan kode dalam konstruktor;
4. Kembalikan objek baru (kembalikan langsung di latar belakang).
Konstruktor dengan prototipe (konstruktor)
Ada properti yang disebut prototipe di JS. Setelah memanggil konstruktor JS untuk membuat objek, objek baru akan memiliki semua properti prototipe konstruktor. Dengan cara ini, beberapa objek mobil dapat dibuat dan prototipe yang sama dapat diakses.
Salinan kode adalah sebagai berikut:
<type skrip = "Teks/JavaScript">
Function Car (Model, Year, Miles) {
this.model = model;
this.year = tahun;
this.miles = mil;
}
Car.prototype.run = function () {
kembalikan this.model + "telah dilakukan" + this.miles + "miles";
};
var benz = mobil baru ('S350', 2010.20000);
var ford = mobil baru ('Ford', 2012,12000);
Console.log (benz.run ()); // "S350 telah dilakukan 20000 miles"
console.log (ford.run ());
</script>
Sekarang satu contoh run () dapat dibagikan di antara semua objek mobil.