Implementation of the promises/a+ specification in JavaScript

Source: Internet
Author: User

Promises is an asynchronous programming model that standardizes asynchronous operations through a set of APIs, which makes it easier to control the flow of asynchronous operations.

The following code assumes that an asynchronous queue is executed, and each item uses the data returned by the previous item:

function Nest (URL, params, fn) {    function(data) {        console.log (data);        Fn.call (this);    });}
function (data1) {    nest(function(data2) {        nest (function(data3)            { Console.log (' synchronous completion ');     });

This is a callback pyramid that requires a lot of callback to be maintained when there are many asynchronous tasks. The nesting of their own eyes can not see it.

promise/a+ specification is to solve the above problem, can be used similar to the following code to improve, "nest" will also make some changes:

Promise.then (Nest (' promise.php ', {a:1}))    . Then (Nest (' promise.php ', {b:2})    . Then (Nest ( ' promise.php ', {c:3});

Is an improved picture example, I also feel in the drawing, the left side of the more difficult to draw, the right is a good painting.

Next, we will focus on improving the pyramid and implementing the specification expansion.

First, promises/a+ specification description

The promises/a+ specification is as follows:

1) One promise may have three states: Wait (Pending), completed (fulfilled), rejected (rejected)

2) A promise state can only be transferred from "Wait" to "done" or "rejected", not reversed, while "complete" and "reject" states cannot convert each other.

3) Promise must implement the then method, and then must return a promise

4) Then the same promise can be called multiple times, and the execution order of the callbacks is consistent with the order in which they were defined

5) Then method accepts two parameters, the first parameter is a successful callback, and is called when the promise is converted from "Wait" to "done" state.

6) The other is the callback at the time of failure, which is called when the promise is converted from "Wait" to "deny" state.

7) Then you can accept another promise incoming, and also accept a "class then" object or method, that is, the Thenable object.

The next step is to implement a simple, complete state, with no rejection and wait status.

Second, simple implementation

The implementation of the Promise object:

functionPromise (FN) { This. _status = ' pending ';  This. _resolves = [];//Queue   This. _FN =fn; return  This;} Promise.prototype={then:function(resolve) {varNext = This. _next | | ( This. _next =NewPromise ());//Next Promise Object     This. _resolves.push (resolve);//Set up Queues    returnNext; }, Resolved:function(value) {//Change State     This. _status = ' fulfilled ';  This. _result = ( This. _FN && This. _FN (value)) | |value;  while(fn = This. _resolves.shift ()) {//Loop Call Queue       This. _fire ( This. _next, FN); }}, _fire:function(Nextpromise, nextfn) {varNextResult = NEXTFN ( This. _result); if(NextResultinstanceofPromise) {//determine if the callback is a Promise object      //the next promise can only be executed if the status of NextResult is fulfilledNextresult.then (function(value) {nextpromise.resolved (value);    }); } Else{nextpromise.resolved (NextResult); }  }};

Functions for demonstration purposes:

function nest2 (URL, params) {  returnfunction(PRE) {    varNew Promise ();     function (data) {      promise.resolved (data);    });     return promise;}  ;} function begin (Value) {  return value + '! ' ;}

Initialization code:

var New Promise (BEGIN);p Romise.then (Nest2 (' promise.php ', {a:1}))  . Then (Nest2 (' promise.php ', {b:2 });p romise.resolved (' start ');

It can also be called in a different way, so that there are multiple values in the internal _resloves queue

New Promise (begin);
Promise.then (Nest2 (' promise.php ', {a:1})) Promise.then (Nest2 (' promise.php ', {b:2})); Promise.resolved (' start ');

Demo Download:

http://download.csdn.net/detail/loneleaf1/9391315

Resources:

Revelation of Http://www.alloyteam.com/2014/05/javascript-promise-mode/JavaScript Promise

Http://www.cnblogs.com/fsjohnhuang/p/4135149.html JS Magic Hall: Analysis of the source code understanding PROMISES/A Specification

Http://www.cnblogs.com/aaronjs/archive/2012/11/17/2774440.html using promises/a

Http://rapheal.sinaapp.com/2013/01/26/jquery-src-deferred/$. Deferred

http://www.ituring.com.cn/article/66566 promises/a+ Specification

Implementation of the promises/a+ specification in JavaScript

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.