如何使用jQuery延迟? [英] How can jQuery deferred be used?
问题描述
jQuery 1.5带来了新的Deferred对象和附加的方法 .when
, .Deferred
和 。 _Deferred
。
jQuery 1.5 brings the new Deferred object and the attached methods .when
, .Deferred
and ._Deferred
.
对于那些没有使用 .Deferred
的人在我注释它的来源之前
For those who havn't used .Deferred
before I've annotated the source for it
这些新方法的可能用途是什么,我们如何将它们拟合成模式?
What are the possible usages of these new methods, how do we go about fitting them into patterns?
我已经读过 API 和 source ,所以我知道它的作用。我的问题是我们如何在日常代码中使用这些新功能?
I have already read the API and the source, so I know what it does. My question is how can we use these new features in everyday code?
我有一个简单的示例缓冲类按顺序调用AJAX请求。 (下一个在前一个完成后开始)。
I have a simple example of a buffer class that calls AJAX request in order. (Next one start after previous one finishes).
/* 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();
};
};
我正在寻找演示和可能用于 .Deferred
和 .when
。
I'm looking for demonstrations and possible uses of .Deferred
and .when
.
看到 ._递延
。
链接到新的 jQuery.ajax
示例的来源是作弊。
Linking to the new jQuery.ajax
source for examples is cheating.
Bounty:向我们展示当我们抽象出操作是同步还是异步完成时可用的技术。
Bounty: Show us what techniques are available when we abstract away whether an operation is synchronously or asynchronously done.
推荐答案
最佳用例我能想到的是缓存AJAX响应。以下是来自 Rebecca Murphey关于该主题的介绍帖子的修改示例:
The best use case I can think of is in caching AJAX responses. Here's a modified example from Rebecca Murphey's intro post on the topic:
var cache = {};
function getData( val ){
// return either the cached value or jqXHR object wrapped Promise
return $.when(
cache[ val ] ||
$.ajax('/foo/', {
data: { value: val },
dataType: 'json',
success: function( resp ){
cache[ val ] = resp;
}
})
);
}
getData('foo').then(function(resp){
// do something with the response, which may
// or may not have been retrieved using an
// XHR request.
});
基本上,如果在从缓存中立即返回值之前已经请求了一次。否则,AJAX请求将获取数据并将其添加到缓存中。 $。当
/ .then
并不关心这些;所有你需要关心的是使用响应,在两种情况下都会传递给 .then()
处理程序。 jQuery.when()
处理非承诺/延期作为已完成的,立即执行任何 .done()
或 .then()
链接。
Basically, if the value has already been requested once before it's returned immediately from the cache. Otherwise, an AJAX request fetches the data and adds it to the cache. The $.when
/.then
doesn't care about any of this; all you need to be concerned about is using the response, which is passed to the .then()
handler in both cases. jQuery.when()
handles a non-Promise/Deferred as a Completed one, immediately executing any .done()
or .then()
on the chain.
当任务可能会或可能不会异步运行时,延迟是完美的,并且您希望从代码中抽象出这种情况。
Deferreds are perfect for when the task may or may not operate asynchronously, and you want to abstract that condition out of the code.
使用 $。的另一个真实世界示例。
helper:
$.when($.getJSON('/some/data/'), $.get('template.tpl')).then(function (data, tmpl) {
$(tmpl) // create a jQuery object out of the template
.tmpl(data) // compile it
.appendTo("#target"); // insert it into the DOM
});
这篇关于如何使用jQuery延迟?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!