JavaScript 中的回调

回调是什么？

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.^[1]

A callback function, also known as a higher-order function, is a function that is passed to another function (let’s call this other function “otherFunction”) as a parameter, and the callback function is called (or executed) inside the otherFunction. ^[2]

A callback function is essentially a pattern (an established solution to a common problem), and therefore, the use of a callback function is also known as a callback pattern.^[2:1]

简单地说: 一个回调函数是，当执行完另外一个函数（通常是异步的）之后，再来执行的一种函数^[3]。也就是说，回调函数是，做完其他“任务”后，再 call back 来执行的函数

更进一步地说: 在 JavaScript 中，因为函数是对象，所以可以作为参数传入所谓的高阶函数，也能被高阶函数作为返回值返回^[4]。任何函数，只要它作为参数传入且随后被调用，都可称之为回调函数^[3:1]。

也就是说，在高阶函数中，作为参数传入的回调函数被当成一个整体来进行调用，从这一层上说，回调函数与抽离出来的子函数没有区别。只是因为他的用途而赋予了“回调”的名称。

How Callback Functions Work?

pass definition as parameter

When we pass a callback function as an argument to another function, we are only passing the function definition. We are not executing the function in the parameter.
And since the containing function has the callback function in its parameter as a function definition, it can execute the callback anytime.^[2:2]

我们对 the containing function_{（“外层的那个函数、方法”）}传递的只是回调函数的定义，而不是在参数处执行这个回调函数_{（执行的话是这个样子`callback()`，是吧）}
当 the containing function “拿到” 了回调函数的定义，那么他想在什么时候执行这个回调函数都可以了

closure

The callback is a closure. As we know, closures have access to the containing function’s scope, so the callback function can access the containing functions’ variables, and even the variables from the global scope.^[2:3]

callback 是一个 closure，所以回调函数可以访问 the containing function 里的变量

使用

this 的指向问题

现在可以用 ES6 的箭头函数^[5]来解决

“Callback Hell” Problem

也就是多重嵌套的匿名回调，使得代码可读性很低

solutions^[2:4]：

1. Name your functions and declare them and pass just the name of the function as the callback, instead of defining an anonymous function in the parameter of the main function.
2. Modularity: Separate your code into modules, so you can export a section of code that does a particular job. Then you can import that module into your larger application.

利用回调函数分离职能^[2:5]

使用场合^[2:6]

• For asynchronous execution (such as reading files, and making HTTP requests)
• In Event Listeners/Handlers
• In setTimeout and setInterval methods
• For Generalization: code conciseness

疑问

在 ajax 等中，“引擎”是如何知道所要的数据到达了，从而来执行 callback 呢？

参考