jQuery 1.5 membawa objek Tangguhan baru dan metode terlampir .when
, .Deferred
dan ._Deferred
.
Bagi mereka yang belum pernah menggunakan .Deferred
sebelumnya, saya telah menjelaskan sumbernya .
Apa saja kemungkinan penggunaan metode baru ini, bagaimana cara memasukkannya ke dalam pola?
Saya sudah membaca API dan sumbernya , jadi saya tahu apa fungsinya. Pertanyaan saya adalah bagaimana kita dapat menggunakan fitur-fitur baru ini dalam kode sehari-hari?
Saya punya contoh sederhana dari kelas buffer yang memanggil permintaan AJAX secara berurutan. (Berikutnya mulai setelah yang sebelumnya selesai).
/* Class: Buffer
* methods: append
*
* Constructor: takes a function which will be the task handler to be called
*
* .append appends a task to the buffer. Buffer will only call a task when the
* previous task has finished
*/
var Buffer = function(handler) {
var tasks = [];
// empty resolved deferred object
var deferred = $.when();
// handle the next object
function handleNextTask() {
// if the current deferred task has resolved and there are more tasks
if (deferred.isResolved() && tasks.length > 0) {
// grab a task
var task = tasks.shift();
// set the deferred to be deferred returned from the handler
deferred = handler(task);
// if its not a deferred object then set it to be an empty deferred object
if (!(deferred && deferred.promise)) {
deferred = $.when();
}
// if we have tasks left then handle the next one when the current one
// is done.
if (tasks.length > 0) {
deferred.done(handleNextTask);
}
}
}
// appends a task.
this.append = function(task) {
// add to the array
tasks.push(task);
// handle the next task
handleNextTask();
};
};
Saya mencari demonstrasi dan kemungkinan penggunaan .Deferred
dan .when
.
Juga akan menyenangkan untuk melihat contoh ._Deferred
.
Menautkan ke jQuery.ajax
sumber baru untuk contoh adalah curang.
Saya terutama tertarik pada teknik apa yang tersedia ketika kita abstrak apakah operasi dilakukan secara sinkron atau tidak sinkron.
sumber
._Deferred
hanyalah "objek tangguhan" sejati yang.Deferred
menggunakan. Ini adalah objek internal yang kemungkinan besar tidak akan Anda butuhkan.Jawaban:
Kasus penggunaan terbaik yang bisa saya pikirkan adalah dalam caching tanggapan AJAX. Berikut adalah contoh yang dimodifikasi dari posting intro Rebecca Murphey tentang topik ini :
Pada dasarnya, jika nilai telah diminta satu kali sebelum dikembalikan segera dari cache. Jika tidak, permintaan AJAX mengambil data dan menambahkannya ke cache. The
$.when
/.then
tidak peduli tentang hal ini; yang perlu Anda khawatirkan adalah menggunakan respons, yang diteruskan ke.then()
pawang dalam kedua kasus.jQuery.when()
menangani yang tidak Janji / Ditangguhkan sebagai yang Selesai, segera mengeksekusi salah satu.done()
atau.then()
pada rantai.Ditangguhkan sempurna untuk saat tugas mungkin atau tidak dapat beroperasi secara tidak sinkron, dan Anda ingin mengabstraksi kondisi itu dari kode.
Contoh dunia nyata lain menggunakan
$.when
helper:sumber
cache[ val ]
TIDAK akan mengembalikan janji (dokumentasi jquery mengatakan bahwa parameternya adalah data yang dikembalikan oleh pengirim) yang berarti bahwa akses anggota.then
akan kesalahan ... kan? Apa yang saya lewatkan?Berikut ini adalah implementasi yang sedikit berbeda dari cache AJAX seperti pada jawaban ehynd .
Seperti disebutkan dalam pertanyaan tindak lanjut fortuneRice, implementasi ehynd sebenarnya tidak mencegah beberapa permintaan yang identik jika permintaan dilakukan sebelum salah satu dari mereka kembali. Itu adalah,
kemungkinan besar akan menghasilkan 3 permintaan AJAX jika hasil untuk "xxx" belum di-cache sebelumnya.
Ini dapat diselesaikan dengan caching permintaan Tangguhan alih-alih hasilnya:
sumber
Ditangguhkan dapat digunakan sebagai pengganti mutex. Ini pada dasarnya sama dengan beberapa skenario penggunaan ajax.
MUTEX
TANGGUHAN
Saat menggunakan Ditangguhkan sebagai mutex saja, perhatikan dampak kinerja (http://jsperf.com/deferred-vs-mutex/2). Meskipun kenyamanan, serta manfaat tambahan yang diberikan oleh Ditangguhkan sangat berharga, dan dalam penggunaan aktual (berdasarkan kejadian pengguna) dampak kinerja seharusnya tidak terlihat.
sumber
Ini adalah jawaban promosi diri, tetapi saya menghabiskan beberapa bulan untuk meneliti ini dan mempresentasikan hasilnya di jQuery Conference San Francisco 2012.
Berikut ini adalah video ceramah gratis:
https://www.youtube.com/watch?v=juRtEEsHI9E
sumber
Kegunaan lain yang saya maksudkan adalah mengambil data dari berbagai sumber. Dalam contoh di bawah ini, saya mengambil beberapa objek skema JSON independen yang digunakan dalam aplikasi yang ada untuk validasi antara klien dan server REST. Dalam hal ini, saya tidak ingin aplikasi sisi browser mulai memuat data sebelum semua skema dimuat. $ .when.apply (). then () sangat cocok untuk ini. Terima kasih kepada Raynos untuk petunjuk penggunaan kemudian (fn1, fn2) untuk memantau kondisi kesalahan.
sumber
Contoh lain menggunakan
Deferred
s untuk menerapkan cache untuk segala jenis perhitungan (biasanya beberapa tugas yang intensif-kinerja atau berjalan lama):Berikut adalah contoh penggunaan kelas ini untuk melakukan beberapa perhitungan (simulasi berat):
Tembolok yang mendasari yang sama dapat digunakan untuk tembolok permintaan Ajax:
Anda dapat bermain dengan kode di atas di jsFiddle ini .
sumber
1) Gunakan untuk memastikan eksekusi callback yang dipesan:
2) Gunakan untuk memverifikasi status aplikasi:
sumber
Anda dapat menggunakan objek yang ditangguhkan untuk membuat desain yang lancar yang bekerja dengan baik di browser webkit. Browser WebKit akan mem-api acara ukuran untuk setiap piksel jendela diubah ukurannya, tidak seperti FF dan IE yang mem-api acara hanya sekali untuk masing-masing ukuran. Akibatnya, Anda tidak memiliki kendali atas urutan fungsi yang terikat pada acara pengubahan ukuran jendela Anda. Sesuatu seperti ini menyelesaikan masalah:
Ini akan membuat serialisasi eksekusi kode Anda sehingga dieksekusi seperti yang Anda inginkan. Waspadalah terhadap jebakan saat meneruskan metode objek sebagai panggilan balik ke yang ditangguhkan. Setelah metode tersebut dieksekusi sebagai panggilan balik ke ditangguhkan, referensi 'ini' akan ditimpa dengan referensi ke objek yang ditangguhkan dan tidak akan lagi merujuk ke objek milik metode.
sumber
resizeQueue.done(resizeAlgorithm)
sama persis denganresizeAlgorithm
. Ini benar-benar palsu!.done
dibuat.Anda juga dapat mengintegrasikannya dengan perpustakaan pihak ketiga mana pun yang menggunakan JQuery.
Salah satu pustaka tersebut adalah Backbone, yang sebenarnya akan mendukung Deferred dalam versi berikutnya.
sumber
read more here
di tempaton my blog
. Ini adalah praktik yang lebih baik dan dapat menyelamatkan Anda menjawab dari (secara tidak sengaja) menjadi spam. :)Saya baru saja menggunakan tangguhan dalam kode nyata. Dalam proyek jQuery Terminal saya memiliki fungsi exec yang memanggil perintah yang ditentukan oleh pengguna (seperti dia memasukkannya dan menekan enter), saya telah menambahkan Tangguhan ke API dan memanggil eksekutif dengan array. seperti ini:
atau
perintah dapat menjalankan kode async, dan eksekutif perlu memanggil kode pengguna secara berurutan. Api pertama saya menggunakan sepasang jeda / melanjutkan panggilan dan di API baru saya memanggil mereka otomatis ketika pengguna kembali berjanji. Jadi kode pengguna bisa digunakan
atau
Saya menggunakan kode seperti ini:
dalyed_commands digunakan dalam fungsi resume yang memanggil exec lagi dengan semua dalyed_commands.
dan bagian dari fungsi perintah (saya telah melucuti bagian tidak terkait)
sumber
Jawaban oleh ehynds tidak akan berfungsi, karena cache data tanggapan. Seharusnya cache cache jqXHR yang juga merupakan Janji. Ini kode yang benar:
Jawaban oleh Julian D. akan bekerja dengan benar dan merupakan solusi yang lebih baik.
sumber