js 回调函数

将函数作为一个参数传入另一个函数中，这个被当做参数的函数就是回调函数

一般回调函数在形参上我们会命名为callback

function f1(){
    console.log('2')
}
function f2(callback){
    console.log('1')
    callback()
}
f2(f1)
// 将f1函数传入f2函数，在f2中执行f1
// 此时f1就是一个回调函数

在上面的示例中，会先打印1，再打印2，很显然，这可以控制代码的执行顺序

js中的代码分为同步和异步

同步：当前任务必须执行完毕后才会执行后续的任务

异步：如果当前任务耗时，会先执行下面的任务

 （同步会按顺序排队，异步可能会插队）

处理异步

回调函数通常用来处理异步代码，让他们乖乖排队

// 这里定义了一个定时器，这里会先打印2，再打印1
setTimeout(function(){
    console.log(1)
},1000)
console.log(2)

// 如果想先打印1，再打印2，只能将打印2的代码放入定时器中
setTimeout(function(){
    console.log(1)
    console.log(2)
},1000)

// 在平时，打印2的步骤可能需要复用，所以使用函数封装起来
function fn(){
    console.log(2)
}
setTimeout(function(){
    console.log(1)
    fn()
},1000)

// 如果不在同一个作用域中呢
function f1() {
    function fn() {
        console.log(2)
    }
    f2(/*fn*/)
}
function f2(/*fn*/) {
    timer: setTimeout(function () {
        console.log(1)
        fn()
    }, 1000)
}
f1()
// fn被定义在f1中，f2里的定时器找不到fn，则会报错
// 此时需要把fn传入f2中(被注释掉的参数fn)，这就是回调函数

高阶函数

高阶函数：可以接收一个函数作为参数的函数

// 我们封装了一个函数,可以打印a
function fn(){
    console.log('a')
}
fn()


// 但是在打印完'a'之后，有的人想接着做别的事
const say = function(){
    console.log('你好')
}
const eat = function(){
    console.log('汉堡')
}

// 既然这样，那就把你们想做的事传进来吧
function fn(doSomething){
    console.log('a')
    doSomething()
}
fn(say)
fn(eat)
// 打印'a'，是这个函数固定的功能
// 不同人做不同的事，是由形参接收的到的函数决定的

这让封装函数更加的活用，可以实现更广泛的功能