为什么要用promise处理ajax,用promise.all解决ajax异步循环请求问题

Promise.all() 并不能解决循环的问题，一般情况下 .all() 的参数是 Promise 数组(暂时不考虑其它类似)。那么，数组中的每个 Promise 都代表着一个异步操作，Promise.all() 的作用是等待这些异步操作全部执行完成，所以实质上并不是 Promise.all() 是并发的，而是 Promise.all() 等待着一堆并发执行完成。

因此，Promise.all() 并不能解决有序循环。作为特例，如果 Promise.all() 等待的全都是同步代码，比如题主示例中虽然用了 .map()，映射结果却并不是 Promise 对象，而是同步执行(直接返回的 id)，这种情况下，实际是依次执行的完了再把结果放入 .all() 的，所以是同步顺序循环处理的(就是 map 干的事情)。题主的第一段代码，如果变量名不是 promises，你觉得它跟异步或者 Promise 有任何关系吗？

然后当然要指出 ajax 调用时候的一个失误：{} 中的内容应该是 ajax 的参数，所以应该放在括号中 ({...}) 才对。

由于 promises 变量保存的只是一个同步运行的结果集，所以 Promise.all(promises) 其实就是对 then() 的回调直接传递的这个结果集，所以 val 的值实际就是 [1, 2]。因此下面这个写法是没有问题的

$.ajax({

data: val

});

问题在于下面这里

Promise.all(promises)

.then(function(val) {

// 问题在把 ajax 放入 then 回调中之后

$.ajax({

data: val

});

})

.catch(function(err) {

// ....

});

这里如果 ajax 发生错误，它不会抛异常，而是等待它自己的 .fail() 处理，因为没有定义，所以就被丢弃了。它并不会传递到后面的 .catch() 中，要解决这个问题，可以是得用 ajax 自己的 .fail() 来处理错误

Promise.all(promises)

.then(function(val) {

// 问题在把 ajax 放入 then 回调中之后

$.ajax({ data: val })

.fail(function(err) {

// 这里处理错误逻辑

});

也可以是，直接将 ajax 的结果(thenable)传递下去，由 Promise 机制的 .catch() 来处理

Promise.all(promises)

.then(function(val) {

// 问题在把 ajax 放入 then 回调中之后

return $.ajax({ data: val });

})

.catch(function(err) {

// 处理错误逻辑

});

为什么要用promise处理ajax,用promise.all解决ajax异步循环请求问题相关推荐

ajax error parsererror,完美解决ajax跨域请求下parsererror的错误
AJAX 的完美解决ajax跨域请求下parsererror的错误 ajax请求报parsererror错误是很宽泛的概念,很多情况下都报这个错, 在很多时候,即使ajax提交.返回都正常 XMLH ...
jsonp跨域的缺点ajax缺点,浅析JSONP解决Ajax跨域访问问题的思路详解
前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息.实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问 ...
php ajax access,转载：解决Ajax跨域 Access to XMLHttpRequest问题
错误提示 Access to XMLHttpRequest at 'http://localhost:8080/api/user/login' from origin 'http://localhos ...
ajax能用sesssion,解决Ajax应用中的session过期问题
现在web开发中,ajax应用的比较多.关于此方面的框架也不少.在应用中都会遇到session过期的问题,如处理不当会影响用户体验,也有可能产生莫名的问题. 结合自己的思考和网上相关内容的参考,给出如 ...
AJAX, callback,promise and generator
AJAX with jQuery $.ajax({url:??,type:??,data:??,success: function(){??} //callback,error:function(jq ...
promise简单封装ajax 完美嵌套多个ajax请求
转载请注明出处并留个言哈,分享快乐~! request.js文件,注意网页头部script标签加载顺序 function myAjax(json, callback) {var p = new Pro ...
ajax、promise、react、缓存笔记记录
ajax请求 1.请求基本步骤 <body><form action="###">手机号:<input type="text" n ...
Promise基本使用，promise 与 Ajax封装
Promise是JS中进行异步编程的新的解决方案表达: ①从语法上看:Promise是一个构造函数 (自己身上有all.reject.resolve这几个方法,原型上有then.catch等方法) ...
javascript-前后端交互-异步调用Ajax与Promise比较
javascript-前后端交互-异步调用Ajax与Promise比较目录文章目录 1.异步调用 1.1.使用场景 1.2.Ajax使用 1.2.1.启动后台 1.2.2.编写前端测试页面 1.3 ...

为什么要用promise处理ajax,用promise.all解决ajax异步循环请求问题

为什么要用promise处理ajax,用promise.all解决ajax异步循环请求问题相关推荐

最新文章

热门文章