UI jQuery Mengapa Menggunakan Pustaka Widget

Menulis pemalam jQuery semudah menambahkan kaedah pada jQuery.prototype (biasanya ditunjukkan sebagai $.fn) dan mengikut beberapa peraturan mudah, seperti mengembalikan this. Jadi mengapa kilang widget wujud?

Dalam bab ini, kami akan menerangkan manfaat Kilang Widget dan memahami bila dan mengapa menggunakannya.

Pemalam Stateless vs. Stateful

Kebanyakan pemalam jQuery adalah stateless, mereka melakukan beberapa tindakan untuk menyelesaikan tugas mereka. Contohnya, jika anda menggunakan .text( "hello" ) untuk menetapkan teks elemen, hasilnya akan sama tanpa fasa pemasangan. Untuk jenis pemalam ini, ia hanya memanjangkan prototaip jQuery.

Walau bagaimanapun, sesetengah pemalam adalah stateful, ia mempunyai kitaran hayat penuh, mengekalkan keadaan dan bertindak balas terhadap perubahan. Pemalam ini memerlukan banyak kod khusus untuk permulaan dan pengurusan keadaan (dan kadangkala pemusnahan). Ini membawa kepada templat untuk mencipta pemalam stateful. Lebih memburukkan lagi keadaan, setiap pengarang pemalam menguruskan kitaran hayat dan status pemalam dengan cara yang berbeza, yang menyebabkan pemalam berbeza mempunyai gaya API yang berbeza. Kilang Widget bertujuan untuk menyelesaikan masalah ini dengan mengalih keluar templat dan mencipta API yang konsisten untuk pemalam.

API Konsisten

Kilang Widget mentakrifkan cara mencipta dan memusnahkan widget, mendapatkan dan menetapkan pilihan, kaedah panggilan dan mendengar peristiwa yang dicetuskan oleh widget. Dengan menggunakan Kilang Widget untuk mencipta pemalam stateful, ia secara automatik mematuhi piawaian yang ditetapkan, menjadikannya lebih mudah untuk pengguna baharu menggunakan pemalam anda. Selain itu, Kilang Widget juga boleh melaksanakan fungsi menentukan antara muka. Jika anda tidak biasa dengan API yang disediakan oleh Kilang Widget, sila lihat Cara Menggunakan Kilang Widget.

Tetapkan pilihan pada permulaan

Apabila anda mencipta pemalam yang menerima pilihan, anda harus menentukan lalai untuk sebanyak mungkin pilihan. Kemudian semasa permulaan, pilihan yang disediakan pengguna digabungkan dengan lalai. Anda juga boleh mendedahkan lalai supaya pengguna boleh menukar lalai. Dalam pemalam jQuery, corak yang biasa digunakan adalah seperti berikut:

$.fn.plugin = function( options ) {
    options = $.extend( {}, $.fn.plugin.defaults, options );
    // Plugin logic goes here.
};
 
$.fn.plugin.defaults = {
    param1: "foo",
    param2: "bar",
    param3: "baz"
};

Pustaka widget (Widget Factory) juga menyediakan fungsi ini dan telah membuat penambahbaikan padanya. Selepas menggunakan Kilang Widget, ia akan kelihatan seperti ini.