Deep js learning-code reuse of callback functions and deep js Learning

Deep js learning-code reuse of callback functions and deep js Learning

In js, a code block is often used repeatedly in multiple places. This method is not conducive to code optimization, and it is also troublesome for personnel maintenance in the future, if the reuse code block needs to be modified in the later stage, only one of them will occur, resulting in problems. In fact, the process is very simple.

Extract the reusable code block and write it as a function. Simply call this function elsewhere.

For example, two functions F1 and F2 both execute code block CODE1. We can encapsulate CODE1 into F3,

 funcitn F1(){F3} funcitn F2(){F3}

However, in actual situations, F3, F4 must be executed in F1, and F3 and F4 must be submitted asynchronously in Ajax. However, F4 must execute AJAX requests in F3 and return TRUE,. Suppose the code is as follows:

 funcitn F1(){F3f4}

Certainly not, because F3 and F4 are both asynchronous requests, F3 has not been executed yet, maybe F4 has started to be executed, so how can F4 be executed after F3 execution is complete.

However, if F3 is restored to a code block, it can be solved, but it cannot achieve the effect of code reuse. You only need to add a CallBack parameter to F3.

The Code is as follows.

function F3(CallBack){     $.post()        .done(funciton(result){          if(result==true&&callBack)             callBack();        });    }     funciton F2(){     F3(F4)     }}

JS callback function

The callback function can continue to expand the functions of a function, which can be very flexible.
For example:
Function showDiv (callback ){
$ ("# Div1"). show ();
Callback ($ ("# div1 "));
}

ShowDiv (function ($ div ){
$ Div. text ("hello world ");
});
// The original showDiv function is actually a div. After the callback function is added, the text in the div can be changed after the show function is executed.

In general, the callback function has many examples in asynchronous mode, because in asynchronous mode, the callback function can only continue to execute an action.
For example:
Function myThread (callback ){
Return setTimeout (1000*10, function (){
$ ("# Div"). append ("<p> hello </p>"); // Add a row in the div after 10 seconds, and then execute the callback function
Callback ();
});
}

What is a JS callback function?

A callback function is a function that is executed after a function is executed. For example:
Function (callback ){
// Code
// Execute the callback function after the preceding code is executed.
If (typeof callback = "function "){
Callback ();

}

}
This is because functions in js can be directly transmitted as parameters.