在项目中,经常会遇到多个相互依赖的异步请求。如有a,b,c三个ajax请求,b需要依赖a返回的数据,c又需要a和b请求返回的数据。如果采用请求嵌套请求的方式自然是不可取的。导致代码难以维护,如何请求很多。会出现很多问题。

Promise就是解决多个异步请求的问题。 Promise是ES6提供的一个对象,用来传递异步操作的消息。

Promise有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。

直接上代码。有a,b请求,b依赖a的请求数据。如下:

     function a(){
return new Promise(function(res,rej){
$.ajax({
url:"a",
type: "GET",
async:true,
dataType:"json",
success:function(data){
console.log(data,"a");
res(data);
}
})
});
}
function b(data){
console.log(data,"data");
return new Promise(function(res,rej){
$.ajax({
url:"b",
type: "POST",
async:true,
data:JSON.stringify(data),
dataType:"json",
success:function(data){
console.log(data,"b");
res();
}
})
});
}
$("#btn").click(function(){
a().then(function (data){
b(data);
}).then(function(){
})
})

接口url在网上找了一个,可以看运行结果:

promise处理多个相互依赖的异步请求的更多相关文章

  1. 使用Promise链式调用解决多个异步回调的问题

    使用Promise链式调用解决多个异步回调的问题 比如我们平常经常遇到的一种情况: 网站中需要先获取用户名,然后再根据用户名去获取用户信息.这里获取用户名getUserName()和获取用户信息get ...

  2. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  3. (转)多个mapreduce工作相互依赖处理方法完整实例(JobControl)

    多个mapreduce工作相互依赖处理方法完整实例(JobControl) 原文地址:http://mntms.iteye.com/blog/2096456?utm_source=tuicool&am ...

  4. 在不用Promise的情况下如何控制异步请求?

    如何更好的控制异步请求?相信大家一定首选Promise对象.确实,使用Promise控制异步请求确实非常方便,直接使用then()方法就可以实现当一个异步请求完成后再处理另一个请求或操作.同时,这样的 ...

  5. Promise.all处理多个异步请求

    一个前台页面需要请求2个rest接口获取数据,一个用于解析文件获取列名,一个查询数据库获得列值. 有很低的概率页面显示为空,刷新可能就有显示了. 使用Promise.all就解决了上面的问题,2部分数 ...

  6. axios - 基于 Promise 的 HTTP 异步请求库

    axios 是基于 Promise 的 HTTP 请求客户端,可同时在浏览器和 node.js 中使用.Vue 更新到2.0之后,作者就宣告不再对 vue-resource 模块更新,而是推荐使用 a ...

  7. Promise,Generator(生成器),async(异步)函数

    Promise 是什么 Promise是异步编程的一种解决方案.Promise对象表示了异步操作的最终状态(完成或失败)和返回的结果. 其实我们在jQuery的ajax中已经见识了部分Promise的 ...

  8. Linux下删除相互依赖的包

    今天遇到一个问题,使用RPM 卸载包的时候两个包相互依赖 包A 和包B 卸载A的时候提示需要先卸载B ,反之亦然 经过一番百度 可以在命令后面加参数--nodeps 例如 rpm -e php-jso ...

  9. Linux环境下RPM包相互依赖的解决办法

    Linux环境下安装Oracle11gR2提示缺少"Package: elfutils-libelf-devel-0.125    FAILED"包,按照提示安装该包时又提示缺少依 ...

随机推荐

  1. Sublime text3插件安装方法

    一.安装sublime text3插件的方法: 1.Ctrl+~键,调出console,将下面代码复制到底部命令行,回车: import urllib.request,os; pf = 'Packag ...

  2. java如何LOG打印出日志信息

    log4j 记录日志方式 log4j 是apache 提供的记录日志的jar 档. 下载路径: http://logging.apache.org/log4j/1.2/download.html 这里 ...

  3. [转]浅谈C++指针直接调用类成员函数

    找了一番之后发现这篇文章讲的很清楚. 传送门

  4. CSS3学习系列之布局样式(二)

    使用盒布局 在CSS3中,通过box属性来使用盒布局,例子如下: <!DOCTYPE html> <html lang="en"> <head> ...

  5. Perl根据日期分割数据文件

    Perl的优势:比C好写,比Shell高效,Linux普遍支持. #!/usr/bin/perl -w # auth: lichmama@cnblogs.com # what: split data_ ...

  6. MapReduce执行流程及程序编写

    MapReduce 一种分布式计算模型,解决海量数据的计算问题,MapReduce将计算过程抽象成两个函数 Map(映射):对一些独立元素(拆分后的小块)组成的列表的每一个元素进行指定的操作,可以高度 ...

  7. javascript 玩转Date对象

    前言:最近在做一个日期选择功能,在日期转换的时候经常换到晕,总结一下常用的Date对象的相关用法,方便日后直接查看使用- 1. new Date()的使用方法有: 不接收任何参数:返回当前时间: 接收 ...

  8. js几秒以后倒计时跳转示例

    代码如下: <html> <head> <title>出错啦~~~</title> <link href="css/login1.css ...

  9. ArrayList源码浅析(jdk1.8)

    ArrayList的实质就是动态数组.所以可以通过下标准确的找到目标元素,因此查找的效率高.但是添加或删除元素会涉及到大量元素的位置移动,所以效率低. 一.构造方法 ArrayList提供了3个构造方 ...

  10. 面向对象15.3String类-常见功能-转换

    public static void main(String[] args) { //2.1// String s="张三,李四,王五";// String [] arr=s.sp ...