A brief analysis of Callback method in Javascript

  • 2020-05-16 06:20:14
  • OfStack

What is a callback


  The callback function is 1 A function called through a function pointer. If you pass the function's pointer (address) as an argument to another 1 When this pointer is used to call the function it points to, we say it is a callback function. The callback function is not called directly by the implementer of the function, but by another when a particular event or condition occurs 1 Called by a party in response to the event or condition.

This explanation looked very complicated, so I found a better one


  Are you going to 1 A store to buy things, just as you want things not in stock, so you left your phone at the clerk there, after a few days of store stock, the clerk called your phone, and then you received the phone to the store to pick up the goods. In this case, your phone number is called the callback function, you leave your phone number with the store clerk and you register the callback function, and then the store has something in stock and it's called the event that triggered the callback, and the store clerk calls you and it's called the call callback function, and you go to the store to get the product and it's called the response callback event. That's all.

In Javascript:


  function A As a parameter ( Function reference ) Pass to the other 1 A function B , and this function B Executive function A . Let's say the delta function A It's called a callback function. If you don't have a name ( Functional expression ) , is called an anonymous callback function.
In effect, you pass the function as an argument.

Javscript Callback

Throw all those complicated explanations into the trash can and see what Callback is

What is Callback

In jQuery, the hide method looks something like this


$(selector).hide(speed,callback)

When you use it,

$('#element').hide(1000, function() {
    // callback function
});

We just have to write a simple function in there

$('#element').hide(1000, function() {
    console.log('Hide');
});

There is a small comment in this: the Callback function is executed after the current animation is 100% complete. Then we can see the real phenomenon of Hide being output in console when the element id is element is hidden.

Which means:

Callback is actually, when a function is done, the function that is being performed is called callback.

Callback role

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


function hello(){
    console.log('hello');
} function world(){
    console.log('world');
} hello();
world();

So normally it will be executed sequentially, but when it takes a long time to execute the world event.

function hello(){
    setTimeout( function(){
        console.log( 'hello' );
    }, 1000 );
} function world(){
    console.log('world');
} hello();
world();

So this is not going to be the case, this is going to be world, hello, so we need callback.

Callback instance

A simple example 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 the example we have an add_callback function that takes three arguments: the first two are the two arguments to add, and the third is the callback function. When the function executes, it returns the sum and outputs 'call 20' in the console.


Related articles: