如何解决回调地狱的问题

定义

回调地狱（callback hell）是指大量嵌套异步js或者使用javascript回调函数导致代码很难直观的理解和调试的场景。

回调只是使用 JavaScript 函数的约定的名称。JavaScript 语言中没有称为“回调”的特殊事物，它只是一种约定。不像大多数函数那样立即返回一些结果，使用回调的函数需要一些时间来产生结果。通常回调仅在进行 I/O 时使用，例如下载东西、读取文件、与数据库对话等。

“异步”意味着“需要一些时间”或“在未来发生，而不是现在”。

示例

举个例子，在打开某个页面时要按顺序发起三次请求，且每一次请求结果都会成为下一次请求的条件。伪代码如下：

ajax({
    url:'/xxx'
    success:function(res1) {
        ajax({
            url:'/xxx?res1'
            success:function(res2) {
                ajax({
                    url:'/xxx?res3'
                    success:function(res3) {
                        console.log(res3)
                    }
                })
            }
        })
    }
})
复制代码

上面的回调函数的嵌套结构就形成了一个回调地狱

解决

异步的js可以改用Promise或者async,await解决。

Promise(请求1).then(res1=>{
    return Promise(请求2?res2)
}).then(res2=>{
    return Promise(请求3?res3)
}).then(res=>{
    console.log(res)
})
复制代码

Promise可以把嵌套的结构改成串联的结构

进一步使用async， await

async function getData() {
    const res1 = await 请求1
    const res2 = await 请求2?结果1
    const res3 = await 请求3?结果2
}
复制代码

参考

有个网站，名字就叫 回调地狱 callbackhell.com/