Note that there are some explanatory texts on larger screens.

plurals
  1. POHow can jQuery deferred be used?
    primarykey
    data
    text
    <p>jQuery 1.5 brings the new Deferred object and the attached methods <a href="http://api.jquery.com/jQuery.when/" rel="noreferrer"><code>.when</code></a>, <a href="http://api.jquery.com/category/deferred-object/" rel="noreferrer"><code>.Deferred</code></a> and <a href="https://github.com/jquery/jquery/blob/1.5/src/core.js#L808" rel="noreferrer"><code>._Deferred</code></a>.</p> <p>For those who havn't used <code>.Deferred</code> before I've annotated the source for <a href="http://jsfiddle.net/Raynos/Hufjr/" rel="noreferrer">it</a></p> <p>What are the possible usages of these new methods, how do we go about fitting them into patterns?</p> <p>I have already read the <a href="http://api.jquery.com/category/deferred-object/" rel="noreferrer">API</a> and the <a href="https://github.com/jquery/jquery/blob/1.5/src/core.js#L892" rel="noreferrer">source</a>, so I know what it does. My question is how can we use these new features in everyday code?</p> <p>I have a simple <a href="http://jsfiddle.net/Raynos/Vg5sY/9/" rel="noreferrer">example</a> of a buffer class that calls AJAX request in order. (Next one start after previous one finishes).</p> <pre><code>/* 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() &amp;&amp; tasks.length &gt; 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 &amp;&amp; deferred.promise)) { deferred = $.when(); } // if we have tasks left then handle the next one when the current one // is done. if (tasks.length &gt; 0) { deferred.done(handleNextTask); } } } // appends a task. this.append = function(task) { // add to the array tasks.push(task); // handle the next task handleNextTask(); }; }; </code></pre> <p>I'm looking for demonstrations and possible uses of <code>.Deferred</code> and <code>.when</code>.</p> <p>It would also be lovely to see examples of <code>._Deferred</code>. </p> <p>Linking to the new <a href="https://github.com/jquery/jquery/blob/1.5/src/ajax.js" rel="noreferrer"><code>jQuery.ajax</code></a> source for examples is cheating.</p> <p><strong>Bounty:</strong> Show us what techniques are available when we abstract away whether an operation is synchronously or asynchronously done.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload