34th Lesson: JQuery Deferred detailed 2

The previous lesson mainly analyzed the jQuery1.51 version of the jquery Deferred. In jQuery1.6, JQuery deferred added two methods, Always,pipe.

Always used to add callbacks, regardless of success or failure, will be executed.

Pipe is the meaning of the pipeline, using the waterfall model for callbacks, the return value of the previous callback is used for the next tune.

Let's give an example to illustrate the difference between pipe and then:

var deferred = $.  Deferred (); //Returns a deferred object

var promise = Deferred.pipe (function (a) {return a*2}). pipe (function (a) {return a*4;}) The return value of the//pipe method is a Promise object, so promise is not equal to deferred.

Deferred.resolve (5); after executing this function, the pipe is called to add a callback function. A=5 in the first callback function, and then returns 10 to the second callback function, so the second callback is a=10.

$. Deferred (). Then (function (a) {return a*2;}). Then (function (a) {return a*4;}). Resolve (5);

The a=5 in the first callback function, the a=10 in the second callback function, is the same as the pipe method. The difference is that the then method returns the deferred object, so it can be chained, and the pipe method returns a Promise object that cannot be chained.

In this version of jquery, deferred began to be massively applied within jquery, including the queue module, the Ajax module.

To give a good example:

var stuff1 = function (deferred) {

SetTimeout (function () {deferred.resolve ()},1000);

};

var stuff2 = function (deferred) {

SetTimeout (function () {deferred.resolve ()},500);

};

var stuff3 = function (deferred) {

SetTimeout (function () {deferred.resolve ()},800);

};

var stuff4 = function (deferred) {

SetTimeout (function () {deferred.resolve ()},800);

};

$.when ( ////This method accepts three deferred objects, only after the state of these three deferred objects has finished (that is, after the respective resolve methods have been executed), the callback method that was added is executed.

$. Deferred (STUFF1), //This method executes the Stuff1 method and passes in the newly created Deferred object, returning this Deferred object, after 1 seconds, calls the Deferred method of this resolve object.

$. Deferred (STUFF2), //Ibid, just asynchronous processing time is different.

$. Deferred (STUFF3) ///Ibid, here's the asynchronous processing of settimeout, which we can consider as the length of time of the AJAX request.

). then (STUFF4); //Add the callback function Stuff4 to the deferred object returned by the $.when () method. This callback stuff4 is executed when the state of all deferred objects passed in in the When method ends.

The understanding of this code can be as follows: There are three AJAX requests, the requested address is not the same, we need to wait until these three AJAX requests are returned, the three request back data to be consolidated processing in order to make the last Ajax request.

jQuery1.7 added the callbacks module, the specific can see: http://www.cnblogs.com/chaojidan/p/4165818.html.

It also rewrote the deferred module. This time the deferred, it is a three-strand structure (donelist,faillist,progresslist). The progresslist chain adds three api,progress,notify,notifywith to add callbacks and trigger callbacks to this chain. What is the progresslist chain used to do? We know that the success queue Donelist and the failed queue faillist are all one-time, that is, triggering once can no longer trigger. But sometimes, we need to trigger repeatedly, then we can use Progresslist to solve.

As an example:

var a = $. Deferred ();

A.done (function (x) {console.log (x);}). Done (function (x) {Console.log (x)});

A.resolve (1);

If you read the previous lesson of the jquery deferred source, you will know that a new delay object A was created, and then by the done method added two successful callback functions, and finally through the resolve method to trigger a successful callback, so will execute the two successful callback function, print out two 1 .

Then if you call A.resolve (2) again, the successful callback of a will not print out two 1.

But Progresslist can,

var B = $. Deferred ();

B.progress (function (x) {console.log (x);}). Progress (function (x) {Console.log (x)});

B.notify (1);

B.notify (2);

The first notify will print out two 1, and the second notify will print two 2.

As you can see from the above example, donelist,faillist triggers a state, it ends, and you trigger the same state again, and the callback function is not executed. But progresslist can trigger multiple states, which means that you simply call notify and execute the progress added callback function.

jQuery1.8 again to the deferred reconstruction, but the idea is consistent.

PROMISE/A is subordinate to the Promise specification, and Promise specification is subordinate to COMMONJS.

The PROMISE/A specification is probably described in this way: an object with the then method, which has 3 states and a fulfilled,rejected,pending. Then the Onfulfill method can pass in three functions, one is the callback function executed at the time of success, one is the callback function executed at the time of failure Onreject, one is the execution of the callback function onnotify, it does not change the state of the object (the first object is in the pending, When the successful callback function Onfulfill is executed, the object becomes fulfilled state, and when the failed callback function onreject is executed, the object becomes rejected state, and when the executing callback function is onnotify, the state of the object does not change. or the pending state). These three functions are optional and are ignored if they are non-functions. The then method returns a new promise object so that chained operations can be implemented.

Later people in the promise/a of the specification added more details, formed the promise/a+ specification. Now there are three big promise/a+ libraries in the market, namely: Q,rsvp,when. Among them, the miniature version of Q was the whole into the ANGULAR.JS,RSVP was ember.js. These two libraries are the famous MVVM libraries. The following chapters will cover these two libraries, and I look forward to it.

The foreground of JS asynchronous processing

Future JavaScript will support the yield generator (generator), which is currently available only in the Firefox browser, but it needs to open the experimental switch itself.

<script type= "Text/javascript; version=1.7 "> //change here to 1.8.

　　You can use yield in this area.

</script>

This yield allows us to easily write asynchronous code in a synchronous manner. You just need to put them in a function body. The corresponding libraries are: Taskjs,gens,tamejs and so on.

Some of the different implementations of asynchronous libraries for performance evaluation, based on the native generator of the overall dominance of the library. Yield statements work more timely than callbacks and take less time.

But at the moment the code for implementing the generator is very large, and the implementation of promise is relatively easy, so promise is the cheapest asynchronous scheme of the moment.

Yield hasn't really developed yet, so there's no need for intensive reading. Know that there is such a thing on the line.

Next lesson, will explain Ajax, you can first look at the Ajax hacks this book.

Come on!

34th Lesson: JQuery Deferred detailed 2