Rumah  >  Artikel  >  hujung hadapan web  >  Perbincangan ringkas tentang analisis_jquery pembina jQuery

Perbincangan ringkas tentang analisis_jquery pembina jQuery

WBOY
WBOYasal
2016-05-16 15:59:531056semak imbas

Dalam artikel terakhir saya, saya menerangkan rangka kerja umum jQuery Saya tahu bahawa semua kod ditulis dalam fungsi tanpa nama panggilan sendiri, dan objek tetingkap dihantar masuk. Kod sumber adalah seperti ini:

(function( window, undefined ) {...})( window );

Kami tahu ia adalah objek melalui amaran(jquery), jadi bagaimana objek ini dibina? Kami menggunakan kaedah penulisan yang serupa dengan $(document) untuk mendapatkan elemen, sama seperti memanggil kaedah biasa secara langsung Adakah jQuery fungsi biasa? Jika ia adalah pembina, mengapa ia bukan bentuk biasa $(dokumen) baru?

Sebenarnya, jQuery ialah perpustakaan js berorientasikan objek, dan ia juga mempunyai pembina Setiap kali kaedah jQuery dipanggil, objek jQeury akan dijadikan instantiated, tetapi cara jQuery ditulis adalah sangat bijak.

Pertama sekali, mari kita bincangkan tentang berorientasikan objek js: Walaupun js bukan bahasa berorientasikan objek, ia mempunyai banyak kaedah penulisan berorientasikan objek, saya mengesyorkan anda untuk melihat bahagian pengaturcaraan berorientasikan objek dalam Turing "Pengaturcaraan Lanjutan Javascript". Di antara banyak kaedah, kaedah penulisan yang paling biasa digunakan ialah kaedah pembinaan tambah prototaip Berikut adalah contoh:

var Person=function(name,age){
  this.name=name;
  this.age=age;
}
Person.prototype={
 constructor:Person,
 init:function(msg){
  this.say(msg);
 },
 say:function(msg){
 alert(this.name+'说'+msg);
 }
};
var tom=new Person('tom',23); 
tom.init('你好');// tom说你好

Malah, jQuery juga menggunakan kaedah ini, tetapi ia menggunakan cara penulisan yang lebih bijak. Mari kita lihat perbezaan antara pembina jQuery

// Define a local copy of jQuery
var jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context, rootjQuery );
},

Daripada kod sumber, kita dapat melihat bahawa fungsi sebenar dalam jQuery ialah kaedah init Apabila kita memanggil jQuery, hasil new init() akan dikembalikan dan bukannya jQuery() baru secara langsung.

Apakah itu jQuery.fn? Kita akan lihat kod ini nanti

jQuery.fn = jQuery.prototype = {...

Ini mudah difahami, sebenarnya, jQuery.fn ialah objek prototaip, yang bermaksud terdapat kaedah init dalam prototaip jQuery, yang merupakan pembina sebenar. Kelebihan menulis dengan cara ini ialah tidak perlu menulis operasi seperti $().init(), dan ia dimulakan secara langsung Walau bagaimanapun, terdapat masalah lain: kerana init ialah pembina, contoh kaedah yang kita tulis jQuery tidak boleh dipanggil. Sememangnya, instantiasi init hanya boleh memanggil kaedah init Kemudian, anda akan melihat kod ini

// Give the init function the jQuery prototype for later instantiation
jQuery.fn.init.prototype = jQuery.fn;

Saya menyebut jQuery.fn=jQuery.protype sebelum ini, yang bermaksud objek prototaip jQuery diberikan kepada prototaip init, supaya kaedah prototaip jQuery secara semula jadi akan tersedia dalam init Melalui kaedah pembinaan S ini, jQuery boleh digunakan Kaedah ini sangat mudah dan tidak memerlukan operasi jQuery() baru atau pemulaan manual Ia semudah memanggil fungsi biasa.

Kenyataan:
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