概念

回调地狱的概念：回调函数里面嵌套回调函数。

//地狱回调
            setTimeout(function () {  //第一层
                console.log(张三);//等3秒打印张三在执行下一个回调函数
                setTimeout(function () {  //第二层
                    console.log(李四);//等2秒打印李四在执行下一个回调函数
                    setTimeout(function () {   //第三层
                        console.log(王五);//等一秒打印王五
                    }, 1000)
                }, 2000)
            }, 3000)

回调地狱是为了让我们代码执行顺序的一种操作（解决异步），但是它会使我们的可读性非常差。

promise解决

// promise解决方式
function fn(str) {
    var promise = new Promise(function (success, error) { //success 是成功的方法  error是失败的方法  
        //处理异步任务
        var flag = true;
        setTimeout(function () {
            if (flag) {
                success(str)
            }
            else {
                error(失败)
            }
        })
    })
    return promise;
}

fn(张三)
    .then((res) => { //then是成功执行的方法 返回的还是一个promise对象
        console.log(res);//打印张三  res是执行
        return fn(李四);
    })
    .then((res) => {
        console.log(res);
        return fn(王五)
    })
    .then((res) => {
        console.log(res);
    })
    .catch((res) => { //catch是失败执行的方法
        console.log(res);
    })

 async/await解决

//封装一个返回promise的异步任务
    function fn(str) {
        var promise = new Promise(function (success, error) {
            var flag = true;
            setTimeout(function () {
                if (flag) {
                    success(str)
                } else {
                    error(处理失败)
                }
            })
        })
        return promise;
    }
 
    //封装一个执行上述异步任务的async函数
    async function test() {
        var res1 = await fn(张三);  //await直接拿到fn()返回的promise的数据，并且赋值给res
        var res2 = await fn(李四);
        var res3 = await fn(王五);
        console.log(res1);
        console.log(res2);
        console.log(res3);
    }
    //执行函数
    test();