As mentioned in the previous article, we need to design an asynchronous call framework. It is best to unify the interfaces for Synchronous asynchronous calls, and the specific call sequence has nothing to do with the implementation method. Now we will design such a framework case.
Transfer callback
The first thing we need to consider is how to pass the callback entry. In the most traditional XHR calls, the callback function will be passed to the asynchronous function as the last parameter:
The Code is as follows:
Function asyncOperation (argument, callback)
When there are quite a few parameters, we can put the parameters in a JSON file. In this way, the parameters are similar to the named parameters and can be passed through the parameter names, if the parameter is not passed, the default value is used. This is a popular practice since Prototype:
The Code is as follows:
Function asyncOperation (argument, options)
However, either method has a disadvantage: when changing a synchronous function to an asynchronous function (or a synchronous asynchronous mixed function), you must explicitly modify the function signature, add one or more parameters at the end.
It is too common for us to introduce asynchronous functions at the underlying layer of the Call Stack. Therefore, it is too costly to change the signature of a large number of upper-layer call functions, so we still want to consider a method that does not need to modify the function signature.
Here I have referred to the IAsyncResult DESIGN OF. NET Framework, and concentrated all information related to asynchronous operations on an object, thus avoiding modification to the function signature. Here, we assume that the call prototype of an asynchronous function is like this:
The Code is as follows:
Function asyncOperation (argument ){
Operation = new Async. Operation ();
SetTimeout (function () {operation. yield ("hello world") ;},1000 );
Return operation;
}
In this Code, we return an Operation object to pass the callback function in the future. At the same time, we use setTimeout to simulate asynchronous return results, and the specific return method is the yield method.
Next, we also need to design a method to pass the callback function. Since we cannot overload the + = Operator like C #, we can only use the function to pass the callback function:
The Code is as follows:
Var operation = asyncOperation (argument );
Operation. addCallback (function (result) {alert (result );});
This design in C # is not secure, because asynchronous operations may be completed before callback is added. However, writing in JavaScript is safe, because JavaScript is single-threaded, and the synchronization addCallback of asyncOperation must be executed first. asynchronous yield in asyncOperation must be executed later.
Call Sequence
Someone may ask, if the user uses synchronous method to call yield, is the execution order different depending on yield implementation? Yes, but yeild is implemented in the Framework at one time. We only need to make it asynchronous, so that even synchronous calls to it will not affect the execution sequence:
The Code is as follows:
Function psudoAsyncOperation (argument ){
Operation = new Async. Operation ();
Operation. yield ("hello world ");
Return operation;
}
Var operation = asyncOperation (argument );
Operation. addCallback (function (result) {alert (result );});
Even if the code is written like this, we can make sure that addCallback runs ahead of yield's actual logic.
Post-Event Callback
Sometimes, framework users may write the code of yield first and addCallback later. At this time, I think it is necessary to ensure that the callback function added in addCallback will be triggered immediately. Because the user adds this callback function, it means that he expects to notify the callback function when the asynchronous operation has a result, which is irrelevant to whether the asynchronous operation is completed when the callback function is added. To this end, we add another use case:
The Code is as follows:
Function psudoAsyncOperation (argument ){
Operation = new Async. Operation ();
Operation. yield ("hello world ");
Return operation;
}
Var operation = asyncOperation (argument );
SetTimeout (function (){
Operation. addCallback (function (result) {alert (result );});
},1000 );
Summary
Here, we have designed an asynchronous Operation object named Async. Operation. How to implement the key yield method and addCallback method will be discussed in the next article.
