js中的回调函数callback

概念：A callback function is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action. from MDN…

翻译过来：回调函数是一个被当作参数传入的的函数，在外部函数内部调用来完成一些动作或者线程

特点：

1.作为参数被传递
2. 在函数内部调用

// 预先声明一个函数
function sayHi(name) {
  alert('Hello ' + name)
}

function processUserInput(callback) {
  var name = prompt('Please say hello')
  // 在内部调用
  callback(name)
}
// 函数被作为参数传递
processUserInput(sayHi);

我们经常看到的一些回调函数：

// (1) 
await api.someApi(param).then(res => {
	// 回调函数体
})

// (2) 
this.$refs['form'].validateForm((valid) => {
// 回调函数体
if (valid) {
	// do something...
}
})

机制：js是异步执行的，也就是说js代码不是一行一行按部就班的去执行的，例如：我们在请求一个网络接口时，我们不知道它什么时候请求完成，这个时候，我们要保证我们能及时获取到服务器返回的数据，我们就要用回调函数来解决。

作用：回调函数可以使请求不阻塞后面的代码，但又能保证我们及时获取到返回的数据。

触发调用：回调函数不是由函数的实现方直接调用，而是在特定的事件或条件发生时由另外的一方调用的，用于对该事件或条件进行响应

举个栗子：你去商店买东西，恰好你要买的东西卖完了，商店老板说你留一个电话吧，啥时候到货了，我再通知你，你留的电话就是回调函数，至于什么时候给你打（触发，调用回调函数）呢，条件是到货了（类似于接口请求OK返回数据）

多个异步处理：在有多个请求的时候，它有可能是不按我们的书写顺序去执行的，那么，这个时候，我们要保证代码按照我们的意思去执行，怎么办呢？答案是：async/await (不过async/await不在本篇讨论的范围内)

// 预先定义回调函数，等待时机触发调用
function getHome(num) {
	console.log('I will call you when i got home num is ', num)
}
// 被当做参数传入函数
function dialNumber(num, cb) {
	cb(num)
}
// 调用
dialNumber('123', getHome)