ES6的Promise

工作中经常会碰到这么一个需求：使用ajax发一个A请求后，成功后拿到数据，我们需要把数据传给B请求

$.ajax({
   url: '',
   dataType:'json',
   success: function(data) {
    // 获取data数据 传给下一个请求
    var id = data.id;
    $.ajax({
        url:'',
        data:{"id":id},
        success:function(){
            // .....
        }
    });
  }
});

如果使用promise可以这样实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
<script>
        function getData(resolve){
            setTimeout(()=>{
                var data = {
                    id: '001'
                };
                resolve(data);
            }, 2000);
        }

        function getData2(data){
            setTimeout(()=>{
                console.log(data.id);
            }, 3000)
        }
        var promise = new Promise(getData);
        promise.then(getData2);
</script>
</body>
</html>



Promise其实就是做了一件事情，那就是对异步操作进行了封装，然后可以将异步操作以同步的流程表达出来，避免了层层嵌套的回调函数，同时提供统一的接口，使得控制异步操作更加容易


posted @ 2017-09-20 14:13  徐同保  阅读(109)  评论(0)  编辑  收藏  举报