Analysis of Callback method in Javascript _ javascript tips-js tutorial

This article mainly introduces the Callback method in Javascript. This article describes what is callback, JavscriptCallback, Callback, and Callback instance. For more information, see What is callback?

The Code is as follows:

A callback function is a function called by a function pointer. If you pass the pointer (address) of a function as a parameter to another function, when this pointer is used to call the function to which it points, we will say this is a callback function. The callback function is called by another party when a specific event or condition occurs instead of by the implementer of the function. It is used to respond to the event or condition.

This explanation looks complicated, so I found a better explanation.

The Code is as follows:

When you go to a store to buy things, what you just want is out of stock, so you left your phone number at the clerk. After a few days there is goods in the store, the clerk called you, then you get the goods from the store after receiving the call. In this example, your phone number is called a callback function. If you leave the phone number to the clerk, it is called a registration callback function. Later, the store purchased the event called triggering a callback Association, the clerk calls you to call the callback function. When you pick up the goods in the store, it is called a response callback event. The answer is complete.

In Javascript:

The Code is as follows:

Function A is passed as A parameter (function reference) to another function B, and function B executes function. Function A is called A callback function. If there is no name (function expression), it is called an anonymous callback function.
In fact, the function is passed as a parameter.

Javscript Callback

Put all the complex explanations above in the trash can ~, Let's see what Callback is.

What is Callback?

In jQuery, the hide method is probably like this.

The Code is as follows:

$ (Selector). hide (speed, callback)

When used,

The Code is as follows:

$ ('# Element'). hide (1000, function (){
// Callback function
});

We only need to write a simple function in it.

The Code is as follows:

$ ('# Element'). hide (1000, function (){
Console. log ('hide ');
});

There is a small comment in it: the Callback function is executed after the current animation 100% is complete. Then we can see the real phenomenon. When the element with id as element is hidden, the Hide will be output in the console.

This means:

The Callback function is actually called the callback function after a function is executed.

Callback Function

Normally, functions are executed in order, but Javascript is an event-driven language.

The Code is as follows:

Function hello (){
Console. log ('hello ');
}

Function world (){
Console. log ('World ');
}

Hello ();
World ();

Therefore, the tasks are executed in sequence normally. However, when the world event is executed for a long time.

The Code is as follows:

Function hello (){
SetTimeout (function (){
Console. log ('hello ');
},1000 );
}

Function world (){
Console. log ('World ');
}

Hello ();
World ();

This is not the case at this time. At this time, the world will be output and hello will be output. Therefore, we need callback.

Callback instance

A simple example is as follows:

The Code is as follows:

Function add_callback (p1, p2, callback ){
Var my_number = p1 + p2;
Callback (my_number );
}

Add_callback (5, 15, function (num ){
Console. log ("call" + num );
});

In this example, we have an add_callback function that receives three parameters: the first two are the two parameters to be added, and the third parameter is the callback function. When the function is executed, the result of adding is returned, and 'call 20' is output in the console '.