回调函数与回调地狱

回调函数

把一个函数当作参数传递给另一个函数，但是此函数并不会立即执行，而是在将来特定的时机再去调用，这个函数就叫做回调函数。在定时器setTimeout以及Ajax的请求时都会用到回调函数。

再举个栗子：

你到一个商店去买东西，刚好你要的东西没有货，于是你在店员那里留下了你的电话，过了几天店里有货了，店员就打了你的电话，然后你接到电话后就到店里去取了货。

在这个例子里，你的电话号码就叫回调函数，你把电话留给店员就叫登记回调函数，店里后来有货了叫做触发了回调关联的事件，店员给你打电话叫做调用回调函数，你到店里去取货叫做响应回调事件。

---

回调函数在我们启动一个异步任务的时候就会告诉它：等你完成了这个任务之后要干什么。这样一来主线程几乎不用关心异步任务的状态了，他自己会善始善终。

// setTimeout中第一个参数就是回调函数，只有在1秒后执行
    setTimeout(() => {
        console.log('执行回调函数！！')
    }, 1000);
    console.log('先执行我捏~~')

根据前面对异步任务的介绍，应该知道此代码会先执行定时器后的语句，再执行定时器及回调函数。

回调地狱

根据前面对异步编程以及回调函数的介绍我们可以得出一个结论：存在异步任务的代码，不能保证其按照顺序执行，那如果我们非要代码顺序执行呢？

比如我要间隔不同时间输出三句话，语序必须是下面这样的：我在定时器1里捏！！，我在定时器2里捏！！，我在定时器3里捏！！

    setTimeout(() => {
        console.log('我在定时器1里捏！！')
    }, 3000)
    setTimeout(() => {
        console.log('我在定时器2里捏！！')
    }, 2000)
    setTimeout(() => {
        console.log('我在定时器3里捏！！')
    }, 1000)
    console.log('我在定时器后捏~~')

当使用定时器顺序调用时，则会出现输出顺序错乱的问题：

所以必须要这样操作，才能保证输出顺序正确：

    setTimeout(() => {
        console.log('我在定时器1里捏！！')
        setTimeout(() => {
            console.log('我在定时器2里捏！！')
            setTimeout(() => {
                console.log('我在定时器3里捏！！')
            }, 1000)
        }, 2000)
    }, 3000)
    console.log('我在定时器后捏~~')

可以看到，代码中的回调函数层层嵌套，并且嵌套了3层，这种回调函数中嵌套回调函数的情况就叫做回调地狱。

所以回调地狱就是为实现代码顺序执行而出现的一种操作，它会造成我们的代码可读性非常差，后期不好维护。

那么该如何解决回调地狱问题呢？