Rumah > hujung hadapan web > tutorial js > Penjelasan terperinci tentang penyelenggaraan rantai prototaip javascript dan kemahiran inheritance_javascript

Penjelasan terperinci tentang penyelenggaraan rantai prototaip javascript dan kemahiran inheritance_javascript

WBOY
Lepaskan: 2016-05-16 16:30:27
asal
1455 orang telah melayarinya

Satu. Dua prototaip

Ramai orang tahu bahawa JavaScript adalah warisan prototaip Setiap pembina mempunyai ahli prototaip, yang melaluinya warisan JavaScript boleh dijelaskan dengan indah Malah, pewarisan JavaScript tidak boleh dilengkapkan dengan bergantung pada atribut ini sahaja.
Prototaip yang kami gunakan dalam kod untuk melengkapkan warisan tidak akan dibincangkan di sini. Anda boleh menyemak maklumat
Seorang lagi ahli prototaip yang tidak kelihatan.
Setiap contoh mempunyai atribut prototaip yang menunjuk kepada prototaip Atribut ini tidak boleh diakses, dan sudah tentu ia tidak boleh diubah suai, kerana ini adalah asas untuk mengekalkan warisan JavaScript.

Salin kod Kod adalah seperti berikut:
//Pengisytiharan pembina
fungsi Guoyansi(){ }
Fungsi GuoyansiEx(){}
//Warisan prototaip
​​​​​ GuoyansiEx.prototype=new Guoyansi();
//Buat objek
      var g1=GuoyansiEx baharu();
      var g2=GuoyansiEx baharu();

Objek dalam kod di atas boleh digambarkan dengan gambar rajah berikut

2. Penyelenggaraan prototaip

Atribut pembina bagi contoh yang dijana oleh pembina sentiasa menunjuk kepada pembina buat sementara waktu.

Salin kod Kod adalah seperti berikut:
fungsi Guoyansi(){ }
var obj1=Guoyansi baharu();
console.log(obj1.constructor===Guoyansi);//true

Sebenarnya, pembina itu sendiri tidak mempunyai pembina atribut, jadi dari manakah atribut ini datang?

Jawapannya ialah: daripada prototaip.
Oleh itu, kesimpulan berikut dibuat

Salin kod Kod adalah seperti berikut:
obj1.constructor===Guoyansi.prototype.constructor= ==Guoyansi
Memandangkan kita boleh mencari pembina melalui pembina, kita boleh menambah baik gambar rajah di atas.

Salin kod Kod adalah seperti berikut:
fungsi GuoyansiEx(){}
                                 GuoyansiEx.prototype=Guoyansi baharu();
console.log(GuoyansiEx.constructor===GuoyansiEx)//false

Mengikut gambar di atas, keputusan di atas sepatutnya benar, tetapi mengapa ia palsu?


Jom buat analisis sekarang.

Prototaip GuoyansiEx telah ditulis semula oleh tika Guoyansi, jadi pembina dalam prototaip GuoyansiEx secara semula jadi daripada tika Guoyansi.
Pembina dalam contoh Guoyansi berasal daripada Guoyansi.prototype Dan Guoyansi.prototype belum ditulis semula,
Jadi pembina Guoyansi.prototype menunjuk ke Guoyansi (pembina);

Berdasarkan analisis di atas, kesimpulan berikut dibuat

Salin kod Kod adalah seperti berikut:
GuoyansiEx.constructor===Guoyansi.constructor=== Guoyansi;
Jika arah Pembina sangat tepat semasa proses pembangunan, anda boleh melakukan perkara berikut.

Salin kod Kod adalah seperti berikut:
/**Kaedah 1:**/
fungsi Guoyansi(){}
fungsi GuoyansiEx(){}
                                 GuoyansiEx.prototype=Guoyansi baharu();
                                                                                                                                                                                                                                                                                                                        GuoyansiEx.prototype.constructor=GuoyansiEx;//Tetapkan semula penunjuk pembina.

Salin kod Kod adalah seperti berikut:

/**
Kaedah 2
**/
fungsi Guoyansi(){}
fungsi GuoyansiEx(){
This.constructor=arguments.callee;
            }
​​​​​​ GuoyansiEx.prototype=new Guoyansi();

Salin kod Kod adalah seperti berikut:

/**
Kaedah 3
**/
fungsi Guoyansi(){}
fungsi GuoyansiEx(){
This.constructor=GuoyansiEx;
            }
​​​​​​ GuoyansiEx.prototype=new Guoyansi();

3. Apakah kegunaan prototaip yang tidak kelihatan?

Kami boleh mengendalikan rantai prototaip yang boleh dilihat untuk melengkapkan warisan kami, tetapi kami tidak dapat melihat atau mengendalikan rantai prototaip yang tidak kelihatan ini.
Pewarisan dalam berorientasikan objek mempunyai ciri: Subkelas mempunyai persamaan dengan kelas induk Oleh itu, dalam subkelas, anda tidak boleh menggunakan padam untuk memadam ahli yang diwarisi daripada kelas induk.
Untuk mengekalkan ciri ini, JavaScript mencipta atribut prototaip di dalam objek yang tidak dapat kita lihat dan tidak membenarkan pengguna mengaksesnya Dengan cara ini, pengguna boleh mengubah suai pembina untuk sebarang tujuan,
Ia tidak akan memusnahkan ciri kelas induk yang ada pada subkelas tersebut.
Ringkasnya: prototaip dalaman diperlukan oleh mekanisme pewarisan prototaip JavaScript, manakala prototaip luaran diperlukan oleh pengguna untuk melaksanakan pewarisan.

4 __proto__ dalam enjin Firefox SpiderMonkey

Ia masih kod ini.

Salin kod Kod adalah seperti berikut:

fungsi Guoyansi(){}
                 Guoyansi.prototype.age=24;
fungsi GuoyansiEx(){}
            var obj1=Guoyansi baharu();
                           GuoyansiEx.prototype=obj1;
​​​​​​ GuoyansiEx.prototype.constructor=GuoyansiEx;//Tetapkan semula titik pembina.
            var obj2=GuoyansiEx baharu();

Saya kini mahu mengakses umur atribut prototaip kelas induk Guoyansi bermula dari obj ke atas.
Ideanya ialah ini.
Langkah satu: obj2====>obj2.constructor.prototype
Bahagian 2: obj2.constructor.prototype===>GuoyansiEx.prototype;
Bahagian 3: GuoyansiEx.prototype===>obj1;
Bahagian 4: obj1.constructor====>Guoyansi
Bahagian 5: Guoyansi.prototype.age

Tulis seperti ini: console.log(obj2.constructor.prototype.constructor.prototype.age)//24;
Keputusan akhir ialah 24.
Keputusan akhir ialah 24. Ia boleh dilaksanakan seperti biasa, tetapi banyak buku mengatakan bahawa selepas pembina diubah suai, prototaip dalam kelas induk tidak dapat ditemui

Memperkenalkan sifat yang lebih ringkas dalam Firefox._proto_

SpiderMonkey menambahkan atribut bernama _proto_ pada mana-mana objek yang dicipta secara lalai, yang menunjuk kepada prototaip yang digunakan oleh pembina.
Sebenarnya, ia adalah rantaian prototaip halimunan yang kami nyatakan di atas, tetapi ia hanya didedahkan kepada umum di sini
Anda boleh mengakses umur
seperti ini console.log(obj2.__proto__.__proto__.age);//24
Ini sememangnya berjaya mengakses atribut prototaip kelas induk, tetapi atribut ini hanya boleh digunakan untuk Firefox dan akan menyebabkan ralat dalam penyemak imbas lain.
Dalam E5, Object.getPrototypeOf() telah diperluaskan kepada Object dan anda boleh mengakses prototaip semua kelas induk.

Salin kod Kod adalah seperti berikut:

fungsi Guoyansi(){}
                 Guoyansi.prototype.age=24;
fungsi GuoyansiEx(){}
            var obj1=Guoyansi baharu();
                           GuoyansiEx.prototype=obj1;
​​​​​​ GuoyansiEx.prototype.constructor=GuoyansiEx;//Tetapkan semula titik pembina.
            var obj2=GuoyansiEx baharu();
          var proto=Object.getPrototypeOf(obj2);
             manakala (proto){
console.log(proto.constructor);
                   proto=Object.getPrototypeOf(proto);
            }
console.log("prototaip objek" proto);

Hasilnya ialah: GuoyansiEx
Guoyansi
Objek
Prototaip objek adalah batal

Secara peribadi, saya fikir ini harus dianggap sebagai salah satu intipati JavaScript berorientasikan objek, sila rujuk sendiri dan gunakannya dalam projek anda sendiri mengikut keperluan anda

Label berkaitan:
sumber:php.cn
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