Using Promises for Efficient Asynchronous Processing
Problem
You want to have your code do something based on the success or failure of an asyn‐
chronous operation.
Solution
One option is to use the new native Promise object. A classic use for Promise in a client
application is to use it with an Ajax call:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Promises</title> <script> var test = new Promise(function(resolve, reject) { var req = new XMLHttpRequest(); req.open('GET', 'http://examples.burningbird.net:8124'); req.onload = function () { if (req.status == 200) { resolve(req.response); } else { reject(req.statusText); } }; req.onerror = function() { reject("network error"); }; req.send(); }); test.then( function(response) { console.log("Response is ", response); }, function (error) { console.error("Request failed: ", error); }); </script> </head> <body> </body> </html>
EXPLAIN
he solution, a Promise is created and assigned to a variable. The Promise encapsulates
an Ajax call to a server application. Instead of assigning a function name to the
XMLHttpRequest’s onload event handler, the function is defined within the Promise, so
it has access to the resolve() and reject() functions, passed as parameters to the
Promise.
If the Ajax request is successful, the resolve() Promise function is called; otherwise,
the reject() function is called.
Once the Promise has been defined, it’s invoked by chaining the Promise’s then()
function call to the variable.
The first parameter to then() is the function that handles
a successful event; the second is a function handling an unsuccessful event.
There is no testing for HTTP status or errors. Instead, an ES 6 promise is used with the
HTTP request, with a status of 200 resolving the promise, sending the HTTP response
to the resolving function, and anything else rejecting the promise, with HTTP status
Text sent to the function.
The E6 Promise allows us to assign handlers to the two possible states of a pending
request: resolved or rejected.
The Promise, and the contained HTTP request, is invoked
with then(), with two parameters: the resolving function, and the rejecting function.
In the earlier incarnations of Node, the developers originally intended to use the concept
of a promise to provide asynchronous access, rather than the last argument callback that
exists today.
I believe this was a good decision, though many folks disagreed with it. I
feel the callback is more intuitively obvious solution, but those that disagree state that
the callback concept fails in more complex situations, where nested callbacks cause
additional complexity.
The interest in promises persisted and now their implementation is being incorporated
into existing and future versions of JavaScript.
No comments:
Post a Comment