Baru -baru ini saya menonton "Javascript Advanced Programming" (Edisi Kedua)
Pembuatan objek dalam javascript
• Mode pabrik
• Mode Konstruktor
• Mode prototipe
• Menggabungkan pola konstruktor dan prototipe
• Mode Dinamis Prototipe
Sebagian besar bahasa yang berorientasi objek memiliki konsep kelas, di mana banyak objek dengan metode dan atribut yang sama dapat dibuat. Meskipun secara teknis, JavaScript adalah bahasa yang berorientasi objek, JavaScript tidak memiliki konsep kelas, semuanya adalah objek. Objek apa pun adalah instance dari jenis referensi tertentu dan dibuat melalui jenis referensi yang ada; Jenis referensi bisa asli atau disesuaikan. Jenis referensi asli adalah: objek, array, data, regexp, fungsi. Lai Jenis referensi adalah struktur data yang mengatur data dan fungsi bersama, biasanya disebut kelas. Dalam JavaScript yang tidak memiliki konsep kelas, masalah yang perlu diselesaikan adalah cara membuat objek secara efisien.
1.1.0. Metode Umum untuk Membuat Objek
var person = {}; // Objek Representasi literal setara dengan var orang = objcect baru (); person.name = 'evansdiy'; person.age = '22'; person.friends = ['ajiao', 'tiantian', 'pangzi']; person.Logname = function () {console.log (this.name);}Berdasarkan jenis referensi objek, suatu objek dibuat, yang berisi empat properti, salah satunya adalah metode. Jika Anda membutuhkan banyak contoh seperti orang, akan ada banyak kode duplikat.
1.1.1. Model pabrik
Buat objek dengan fungsi yang dapat berisi detail objek dan kemudian mengembalikan objek.
Function Person (Nama, Usia, Teman) {Var O = {Name: Name, Umur: Usia, Teman: Teman, Logname: Function () {Console.log (this.name); }}; kembalikan o;} var person1 = orang ('evansdiy', '22', ['ajiao', 'tiantian', 'pangzi']);Setiap kali fungsi orang dipanggil, objek baru dibuat melalui objek o di dalam fungsi, dan kemudian dikembalikan. Terlepas dari ini, objek internal ini ada untuk membuat objek baru tidak memiliki tujuan lain. Selain itu, tidak mungkin untuk menentukan jenis objek yang dibuat oleh mode pabrik.
1.1.2. Mode konstruktor
Function Person (Name, Umur, Job) {this.name = name; this.age = usia; this.job = pekerjaan; this.logname = function () {console.log (this.name); }} // Buat contoh orang melalui operator baru var person1 = orang baru ('boy-a', '22', 'pekerja'); var person2 = orang baru ('girl-b', '23', 'guru'); orang1.logname (); //boy-aperson2.logname (); // Girl-AMembandingkan mode pabrik, kita dapat menemukan bahwa tidak perlu membuat objek perantara di sini, tidak ada pengembalian. Selain itu, contoh konstruktor dapat diidentifikasi sebagai jenis tertentu, yang memecahkan masalah pengenalan objek (dengan memeriksa atribut konstruktor dari instance, atau menggunakan instance dari operator untuk memeriksa apakah instance dibuat oleh konstruktor).
console.log (person1.constructor == orang); // Konstruktor terletak di prototipe konstruktor dan menunjuk ke konstruktor, dan hasilnya benar
Console.log (orang1 orang); // Gunakan instance dari operator untuk menentukan apakah orang1 adalah instance dari orang konstruktor, tetapi pola konstruktor juga memiliki masalah sendiri. Bahkan, metode LOGNAME akan diciptakan kembali sekali pada setiap instance. Perlu dicatat bahwa metode yang dibuat oleh instantiasi tidak sama, dan kode berikut akan menjadi salah:
console.log (person1.Logname == person2.logname); // false kita dapat memindahkan metode di luar konstruktor (diubah menjadi fungsi global) untuk menyelesaikan masalah ini:
function logname () {console.log (this.name);} function logage () {console.log (this.age);}Namun, fungsi global yang dibuat secara global hanya dapat disebut oleh contoh yang dibuat oleh orang, yang sedikit tidak realistis; Jika ada banyak metode, mereka masih perlu didefinisikan satu per satu, kurang enkapsulasi.
1.1.3. Mode prototipe
Setiap fungsi dalam JavaScript berisi pointer ke atribut prototipe (sebagian besar browser dapat mengaksesnya melalui atribut internal __proto__), atribut prototipe adalah objek yang berisi properti dan metode yang dibagikan oleh semua contoh yang dibuat oleh jenis referensi tertentu.
function person () {} person.name = 'evansdiy'; person.prototype.friends = ['ajiao', 'jianjian', 'pangzi']; person.prototype.logname = function () {console.log (this.name);} var person1 = new orang ();Kode di atas melakukan hal -hal ini:
1. Tentukan orang konstruktor. Fungsi orang secara otomatis memperoleh properti prototipe. Properti ini hanya berisi properti konstruktor yang menunjuk ke orang secara default;
2. Tambahkan tiga atribut melalui orang. Prototipe, salah satunya digunakan sebagai metode;
3. Buat instance orang, lalu hubungi metode LOGNAME () pada instance. Lai
Yang perlu Anda perhatikan di sini adalah proses panggilan metode LOGNAME ():
1. Cari metode logname () pada instance orang1 dan menemukan bahwa tidak ada metode seperti itu, jadi saya menelusuri kembali ke prototipe orang1
2. Cari metode logame () pada prototipe orang1. Ada metode ini. Jadi kami menyebut metode ini berdasarkan proses pencarian seperti itu. Kami dapat mencegah instance mengakses atribut nama yang sama pada prototipe dengan mendefinisikan atribut nama yang sama dalam prototipe pada instance. Perlu dicatat bahwa melakukan hal itu tidak akan menghapus atribut nama yang sama pada prototipe, tetapi hanya akan mencegah instance mengakses.
var person2 = orang baru ();
orang2.name = 'laocai'; Jika kita tidak lagi membutuhkan properti pada instance, kita dapat menghapusnya melalui operator hapus.
hapus orang2.name; Gunakan loop untuk untuk menyebutkan semua atribut yang dapat diakses oleh instance (terlepas dari apakah atribut ada dalam instance atau dalam prototipe):
untuk (i in person1) {console.log (i);}Pada saat yang sama, Anda juga dapat menggunakan metode HasownProperty () untuk menentukan apakah ada properti tertentu pada instance atau dalam prototipe. Hanya ketika properti ada dalam contoh akan benar dikembalikan:
console.log (person1.hasownproperty ('name')); // true! HasownProperty berasal dari prototipe objek dan merupakan satu -satunya cara dalam JavaScript untuk tidak mencari rantai prototipe saat memproses properti. [via JavaScript Secret Garden] Selain itu, Anda juga dapat menggunakan metode In Operator dan HasownProperty () untuk menentukan apakah properti tertentu ada dalam contoh atau dalam prototipe:
console.log (('teman' secara pribadi1) &&! person1.hasownproperty ('friends' ')); pertama -tama tentukan apakah orang1 dapat mengakses properti teman. Jika memungkinkan, lalu tentukan apakah properti ini ada dalam instance (perhatikan sebelumnya!). Jika tidak ada dalam contoh, itu berarti bahwa properti ini ada dalam prototipe. Seperti yang disebutkan sebelumnya, prototipe juga merupakan objek, sehingga kita dapat menulis prototipe menggunakan representasi literal objek. Metode penulisan sebelumnya untuk menambahkan kode ke prototipe dapat dimodifikasi ke:
Person.prototype = {name: 'evansdiy', teman: ['ajiao', 'jianjian', 'pangzi'], logname: function () {console.log (this.name); }}Karena sintaks literal objek menulis ulang seluruh prototipe prototipe, atribut konstruktor yang diperoleh secara default saat membuat konstruktor akan menunjuk ke konstruktor objek:
// Setelah objek literal menulis ulang prototipe
Console.log (person1.constructor); // Object Namun, instance dari operator masih akan mengembalikan hasil yang diinginkan:
// Setelah objek literal menulis ulang prototipe
console.log (orang 1 instance dari orang); // Benar tentu saja, Anda dapat mengatur nilai konstruktor secara manual dalam prototipe untuk menyelesaikan masalah ini.
Person.prototype = {constructor: person, ......}Jika objek prototipe dimodifikasi setelah instance objek dibuat, modifikasi prototipe akan segera tercermin dalam semua instance objek:
function person () {}; var person1 = orang baru (); person.prototype.name = 'evansdiy'; console.log (person1.name); // 'evansdiy'Koneksi antara instance dan prototipe hanyalah pointer, bukan salinan prototipe. Prototipe sebenarnya adalah proses pencarian. Setiap modifikasi yang dibuat untuk objek prototipe akan tercermin dalam semua instance objek, bahkan jika prototipe dimodifikasi setelah instance dibuat. Bagaimana jika objek prototipe ditulis ulang setelah membuat instance objek?
function person () {}; var person1 = new person1 (); // instance yang dibuat mengacu pada prototipe asli // prototipe person.prototype = {friends: ['ajiao', 'jianjian', 'pangzi']} var person2 = new person ();//instance ini merujuk pada console console baru. console.log (person1.friends);Kode di atas akan memiliki kesalahan yang tidak ditentukan saat dieksekusi ke baris terakhir. Jika kita menggunakan For-in untuk menyebutkan properti yang dapat diakses secara pribadi1, kita akan menemukan bahwa tidak ada di dalamnya, tetapi orang2 dapat mengakses atribut teman pada prototipe. Lai Menulis ulang prototipe memotong koneksi antara prototipe yang ada dan semua instance objek yang dibuat sebelumnya. Prototipe instance objek yang dibuat sebelumnya masih ada, tetapi sudah tua.
// Saat membuat orang1, objek prototipe belum ditulis ulang. Oleh karena itu, konstruktor dalam objek prototipe masih merupakan console.log.
Perlu dicatat bahwa pola prototipe mengabaikan proses parameter yang lewat untuk konstruktor, dan semua contoh memperoleh nilai atribut yang sama. Pada saat yang sama, ada masalah besar dengan pola prototipe, yaitu, nilai tipe referensi dalam objek prototipe akan dibagikan oleh semua contoh, dan modifikasi nilai jenis referensi juga akan tercermin dalam semua contoh objek.
function person () {}; person.prototype = {friends: ['ajiao', 'tiantian', 'pangzi']} var person1 = orang baru (); var person2 = orang baru (); orang1.friends.push ('laocai'); console.log (orang2.Memodifikasi nilai jenis referensi orang1 teman berarti bahwa teman -teman secara pribadi2 juga akan berubah. Faktanya, teman -teman yang disimpan dalam prototipe sebenarnya hanya pointer untuk nilai teman di tumpukan (panjang pointer ini diperbaiki dan disimpan di tumpukan). Ketika sebuah instance mengakses nilai jenis referensi melalui prototipe, itu juga diakses oleh pointer alih -alih mengakses salinan pada instance masing -masing (salinan seperti itu tidak ada).
1.1.4. Buat objek dalam kombinasi dengan pola konstruktor dan prototipe
Menggabungkan keunggulan mode konstruktor dan prototipe, menebus kekurangan masing -masing, menggunakan konstruktor untuk melewati parameter inisialisasi, mendefinisikan atribut instance di dalamnya, dan menggunakan prototipe untuk menentukan metode umum dan atribut publik. Mode ini paling banyak digunakan.
function person (name, use) {this.name = name; this.age = usia; this.friends = ['ajiao', 'jianjian', 'pangzi'];} person.prototype = {constructor: person, logname: function () {console.log (this.name); }} var person1 = orang baru ('evansdiy', '22'); var person2 = orang baru ('amy', '21'); person1.Logname (); // 'evansdiy'person1.friends.push (' haixao '); konsol.1.1.5. Mode Dinamis Prototipe
Mode dinamis prototipe merangkum semua informasi yang diperlukan ke dalam konstruktor, dan menggunakan pernyataan IF untuk menentukan apakah properti tertentu dalam prototipe ada. Jika tidak ada (ketika konstruktor dipanggil untuk pertama kalinya), jalankan kode inisialisasi prototipe di dalam pernyataan IF.
function person (name, use) {this.name = name; this.age = usia; if (typeof this.logname! = 'function') {person.prototype.logname = function () {console.log (this.name); }; Person.prototype.logage = function () {console.log (this.age); }; }; };} var person1 = orang baru ('evansdiy', '22'); // Konstruktor dipanggil untuk pertama kalinya, dan prototipe dimodifikasi saat ini. var person2 = orang baru ('amy', '21'); // metode logname () sudah ada dan prototipe tidak akan dimodifikasi lagiPerlu dicatat bahwa pola ini tidak dapat menggunakan sintaks literal objek untuk menulis objek prototipe (ini akan mengganti objek prototipe). Jika prototipe ditulis ulang, objek prototipe yang dapat diakses ke instance pertama yang dibuat oleh konstruktor tidak akan berisi properti objek prototipe dalam pernyataan IF.
function person (name, use) {this.name = name; this.age = usia; if (typeof this.logname! = 'function') {person.prototype = {logname: function () {console.log (this.name); }, logage: function () {console.log (this.age); }}}};} var person1 = orang baru ('evansdiy', '22'); var person2 = orang baru ('amy', '21'); orang2.logname (); // 'Amy'person1.Logname (); // Metode LOGNAME () tidak adaPerlu dicatat bahwa setiap model memiliki skenario aplikasinya sendiri, dan tidak masalah kelebihan dan kekurangannya.
Analisis di atas berbagai pola membuat objek dalam JavaScript adalah semua konten yang saya bagikan dengan Anda. Saya harap ini dapat memberi Anda referensi dan saya harap Anda dapat mendukung wulin.com lebih lanjut.