What exactly is a callback function? There are many articles online, and most of them leave readers confused. These articles roughly fall into two categories: the first piles up too much jargon, making it unreadable without understanding the terminology; the second does the opposite, avoiding jargon entirely and using life examples completely unrelated to programming as analogies, which confuses readers even more.
As the core of JS, callback functions are closely related to asynchronous execution. Without crossing this threshold, many callback code snippets can leave people dizzy!
Quoting the description from an expert on Stack Overflow, callbacks are actually very simple and pure:
A "callback" is any function that is called by another function which takes the first function as a parameter. (Calling one function within another function is a callback.)
Here is the simplest example:
function a() {
return 1
}
function b(aa) {
return 2 + aa
}
//调用:
var c=0
c = b(a()) //A是个函数,但它又作为一个参数在B函数中被调用
console.log(c) //结果显示3
The above example is very easy to understand. Now let's introduce another concept:Asynchronous
Look at the following code:
var a = 0
function bb(x) {
console.log(x)
}
function timer(time) {
setTimeout(function () {
a=6
}, time);
}
//调用:
console.log(a)
timer(3000)
bb(a)
The above code is very simple. The logic we need is: the global variable a starts at 0, then after 3 seconds, it should become 6, and then be printed. At first glance, the above code seems fine and theoretically meets our logical requirements, but we find the result is like this:
0 0
What's going on?
Because JS is an asynchronously executed language. Even though the timer function sets a=6, JS does not wait for the time to end before exiting the function; instead, it immediately executes the next statement (i.e., calls the bb function). But at this point, the 3 seconds haven't ended at all, and a hasn't been reassigned yet, so it still prints 0.
Using a callback function can solve this problem:
var a = 0
function bb(x) {
console.log(x)
}
function timer(time, callback) {
setTimeout(function () {
a = 6
callback(a);
}, time);
}
//调用:
console.log(a)
timer(3000,bb)
This time, a keyword called callback is added to the timer function, meaning that this is not an ordinary parameter but a function name. Pay attention—here comes the key part:
Generally speaking, a function's formal parameters are entrances where variables are passed from outside into the function body. But adding callback here is completely the opposite—it is an exit where the function body calls the external function after completing some mission! At this point, you should understand what "callback" means—it means calling back to the external function.
In this example, when the 3 seconds are up, first a=6, then the function bb(x) is called via the keyword callback(a), and the result shows:
0 6
This logic meets our requirements.
In terms of syntax, you don't need to define the function bb. You can directly write it in function form when calling timer. Changing the calling part to this also works, with exactly the same effect:
console.log(a)
timer(3000, function (x) {
console.log(x)
})
With this style, even the function name is not needed (the term is "anonymous function"). It is more common and easier to understand in Node.js code. Translated into natural language: set a timer for 3 seconds, and after completion, call back the contents inside function(x).
Node.js programming heavily uses asynchronous programming techniques, which is to use hardware efficiently and also avoid synchronous blocking. In fact, Node.js implements asynchronous operations at the underlying level through multithreading technology, but ordinary users don't need to dig into how it is implemented. We just need to handle our asynchronous processing well.
Author: rockage
Original article: https://blog.csdn.net/rockage/article/details/79513450