码迷,mamicode.com
首页 > 其他好文 > 详细

基于PROMISE解决回调地狱问题

时间:2019-08-19 17:29:08      阅读:90      评论:0      收藏:0      [点我收藏+]

标签:col   script   javascrip   span   bsp   str   result   逻辑   问题:   

  回调地狱问题:

    在使用JavaScript时,为了实现某些逻辑经常会写出层层嵌套的回调函数,如果嵌套过多,会极大影响代码可读性和逻辑,这种情况也被成为回调地狱。比如说你要把一个函数 A 作为回调函数,但是该函数又接受一个函数 B 作为参数,甚至 B 还接受 C 作为参数使用,就这样层层嵌套,人称之为回调地狱,代码阅读性非常差。

    例如:要发送三个异步的请求要求前面一个请求完成之后再依次发送请求。

$.ajax{
    url:‘url1‘,
    success:result=>{
        $.ajax{
            url:‘url2‘,
            success:result=>{
                $.ajax{
                    url:‘url3‘,
                    success:result=>{
                        
                    }
                };
            }
        };
    }
};//这就是一个栗子

    基于PROMISE解决

    Promise:ES6新增的内置类,是为了管理异步操作的。

//封装成多个方法
let queryA = function(){
    return new Promise(resolve=>{
        $.ajax({
            url:‘url1‘,
            success:resolve,
        });
    }); 
}
let queryB = function(){
    return new Promise(resolve=>{
        $.ajax({
            url:‘url2‘,
            success:resolve,
        });
    }); 
}
let queryC = function(){
    return new Promise(resolve=>{
        $.ajax({
            url:‘url3‘,
            success:resolve,
        });
    }); 
}
//先将queryA返回的实例赋给promise,每次执行then都会返回新的Prmise实例
let promise = queryA();
promise.then(result=>{
    console.log(1);
    return queryB();//将queryB的实例返回作为下一个的实例用于调用下一个then
}).then(result=>{
    console.log(2);
    return queryC();
}).then(result=>{
    console.log(3);
});

 

基于PROMISE解决回调地狱问题

标签:col   script   javascrip   span   bsp   str   result   逻辑   问题:   

原文地址:https://www.cnblogs.com/angle-xiu/p/11377659.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!