JavaScript's callback callback function

The following lessons from the experience and knowledge of the veteran, combined with their own learning, the essence of the summary.

Bottom line: It's helpful to study node and those popular front-end frames later. If you've read this article, it's a qualitative mutation for you.

Understanding the callback function (' callback ') in JavaScript is helpful to you.

In Javascrip, function is a built-in class object, which means that it is a type of object that is used for the management of built-in objects just like other objects of string, Array, number, and object classes.

A function is actually an object that can be "stored in a variable, passed to (a function) by a parameter, created inside a function, and returns a result value from a function."

One of the main techniques of functional programming is the callback function, which implements the callback function as simple as passing a generic parameter variable.

# # So the first question comes, what is a callback?

A callback function is considered to be an advanced function, an advanced function that is passed as a parameter to another function (which is called ' otherfunction '). The callback function is called (or executed) within ' otherfunction '.

The essence of a callback function is a pattern (a pattern that solves common problems), so a callback function is also called a callback pattern.

> An example:

var colors=[' red ', ' yellow ', ' blue ', ' Green '];colors.foreach (function(color,i) {     + 1 + '. ' + color)  //  console output: 1.red, 2.yellow,. Blue, 4.green})

Here we pass an anonymous function to the ' foreach ' method, as a ' foreach ' argument, passing an anonymous function as a parameter to another function or method.

> Here's an example of a jquery common callback function:

<button class= "BTN" >btn</button>$ (". btn"). Click (function() {  // The anonymous function is called in the function body of the Click function, even if there is no name, it can be accessed by the containing function through the arguments object. 

alert ("clicked");});
}

Also here pass a function to the parameters of the click Method, and the click Method will call (or execute) The callback function passed to him.

# # # So much has been said, how is the callback function implemented?

The callback function is used as a variable, as an argument to another function, and is called in another function as the returned result.

Here we pass a callback function as a parameter to another function, we pass only the definition of the function and do not execute it in the argument.

It can be called at any time when the function (which refers to a call or Execute function) has a callback function defined in the parameter.

It also shows that the callback function is not executed immediately, but rather it is recalled at the location specified in the function body containing the function.

> Take another look at this example

functionsum (callback) {//Array.prototype.slice.call (arguments,1) can convert an object with the length property to an array, arguments is a keyword that represents the current parameter, Although arguments is represented as an array on the surface of JavaScript, there is actually no function of native array slice.
Using the call method here is a correction to the arguments object's incomplete array function.     //Slice returns an array in which the first element in the array is dropped if the method has only one parameter. For the purposes of this context, the first parameter of the original array is a callback function named Add, and the subsequent element is the list of arguments accepted by the processing function.     varargs = Array.prototype.slice.call (arguments, 1);//In layman's terms, the function of this line of code is to make an array of all the formal parameters accepted by the function, delete the first element in the array, assign the array to args    typeofcallback = = = ' function ' && callback (args);//If there is a callback function in the parameter, the args are passed to the callback function as a formal parameter and executed. console.log (args)}//Add all the elements in the array that are passed infunctionAdd (options) {varTotle = 0; Options.map (function(item) {if(typeofitem = = = ' object ' && Object.prototype.toString.call (item) = = = ' [Object Array] ') {Item.map (function(Itemcell) {Totle+=Itemcell}) } Else{totle+=item; }}) Console.log (Totle);} Sum (Add,1, 2, 3, 4, 5, [10, 20])

Look at the output of the console:

Array (6) is an array of all the parameters except the callback function, and 45 is the result of adding all the elements within the array (6) within the callback function.

The > callback function is a closed packet

When passing another function as a parameter, the callback function is executed somewhere within the body of the containing function function, as if the callback function is defined in the function body that contains the function. This means that the callback function is a closed packet:

# # Implementation of the basic principle of callback function

> Using named functions or anonymous functions as callbacks

In the preceding jquery and foreach examples, we define anonymous functions in the parameters that contain the function, which is one of the common forms of using a callback function.

Another commonly used form is to define a function with a name and pass the function name as an argument to another function, for example:

    function fn () {        console.log ("with name function")    }    function  test1 (FN) {        fn ();    }    Test1 (FN);

JavaScript's callback callback function