async.js is a library that aims to make it so you don’t have to mess with callbacks when making applications in JavaScript 1.7 or higher by using the yield statement to pause function execution.
Examples
Please note that user interaction with the page is not blocked during the course of any of these examples.
A node.next(eventType) method
The node.next(eventType) method would pause a function until the specified event is fired on the node that next was called on and would return the captured event object.
var listenForNextEventDispatch = function ([node, eventType], callback) {
var listener = function (event) {
node.removeEventListener(eventType, listener, false);
callback(event);
};
node.addEventListener(eventType, listener, false);
};
Node.prototype.next = function (eventType) {
return [listenForNextEventDispatch, [this, eventType]];
}; |
var listenForNextEventDispatch = function ([node, eventType], callback) {
var listener = function (event) {
node.removeEventListener(eventType, listener, false);
callback(event);
};
node.addEventListener(eventType, listener, false);
};
Node.prototype.next = function (eventType) {
return [listenForNextEventDispatch, [this, eventType]];
};
You could now do the following in an async()ed function to handle the next click event on the document.
var clickEvent = yield document.next("click");
// handle click event here |
var clickEvent = yield document.next("click");
// handle click event here
Asking the user for their impressions of async.js
The following code does not use any obtrusive and annoying functions like prompt or alert yet still can utilize execution-blocking features.
yield to.request("feedback", "POST", (
yield to.prompt("What are your impressions of async.js?")
));
yield to.inform("Thanks for your feedback!");
// do more stuff here |
yield to.request("feedback", "POST", (
yield to.prompt("What are your impressions of async.js?")
));
yield to.inform("Thanks for your feedback!");
// do more stuff here
As opposed to the following, which is functionally equivalent to the previous code but doesn’t use async.js’s blocking features.
async.prompt(
["What are your impressions of async.js?"],
function (response) {
async.request(
["feedback", "POST", response],
function () {
async.inform(
["Thanks for your feedback!"],
function () {
// do more stuff here
}
);
}
);
}
); |
async.prompt(
["What are your impressions of async.js?"],
function (response) {
async.request(
["feedback", "POST", response],
function () {
async.inform(
["Thanks for your feedback!"],
function () {
// do more stuff here
}
);
}
);
}
);
That’s a lot of callbacks, all of which are implied when you use async.js.
Creating an async.js module for thatFunctionThatUsesCallbacks
async.yourMethodName = function ([aParameterThatFunctionUses], callback) {
thatFunctionThatUsesCallbacks(aParameterThatFunctionUses, callback);
}; |
async.yourMethodName = function ([aParameterThatFunctionUses], callback) {
thatFunctionThatUsesCallbacks(aParameterThatFunctionUses, callback);
};
You could then use yield to.yourMethodName(aParameterThatFunctionUses) and immediately start writing code that depends onthatFunctionThatUsesCallbacks function after the statement.
