AngularJS中处理多个promise的方式


Posted in Javascript onFebruary 02, 2016

在使用AngularJS中处理promise的时候,有时会碰到需要处理多个promise的情况。

最简单的处理就是每个promise都then。如下:

var app = angular.module("app",[]);
app.controller("AppCtrl", function($q. $timeout){
var one = $q.defer();
var two = $q.defer();
var three = $q.defer();
$timeout(function(){
one.resolve("one done");
}, Math.random() * 1000)
$timeout(function(){
two.resolve("two done");
}, Math.random() * 1000) 
$timeout(function(){
three.resolve("three done");
}, Math.random() * 1000) 
functioin success(data){
console.log(data);
}
one.promise.then(success);
two.promise.then(success);
three.promise.then(success);
})

有没有更好的方式?

$q.all方法可以接受promise的一个数组,按如下调用:

var all = $q.all([one.promise, two.promise, three.promise]);
all.then(success);

什么是promise?

promise是一种用异步的方式处理值的方法,promise是对象,代表了一个函数最终可能的返回值或者抛出的异常,在与远程对象打交道时我们可以把他看作是远程对象的一个代理。 如果说是promise也是异步处理方式的一种,那么我们会想起它和XHR和$.ajax有啥区别呢?

习惯上js使用闭包或者回调来相应非同步返回的数据,比如页面加载之后的XHR请求。我们可以跟数据进行正常交互,就好像它已经返回了一样,而不需要依赖回调函数的触发。

那么ng提出的promise是为了解决什么问题呢? 回调已经被使用了很长时间,通常如果有回调依赖其他还回调时将会时调试变得非常艰难,每一步调用之后都需要显示处理错误。与之不同的是promise提供了另外一个抽象:这些函数返回promise对象。

为什么使用promise

使用了promise的收获之一是逃脱了回调的固定思维逻辑。promise让异步处理的机制看上去更像是同步,基于同步函数我们可以按照预期来捕获返回值和异常值。可以在程序中的任何时刻捕捉错误,并且绕过依赖于程序异常的后续代码,我们不需要思考这个同步带来的好处。因此使用promise的目的是:获取功能组合和错误冒泡能力的同时,保持代码异步运行的能力。

promise是头等对象,自带了一些约定。

• 只有一个resolve或者reject会被调用到。

• 如果promise被执行或者被拒绝了,依赖于他们的处理程序仍然会被调用。

• 处理程序总是会被异步调用。

Javascript 相关文章推荐
Jquery 基础学习笔记之文档处理
May 29 Javascript
一些常用的JavaScript函数(json)附详细说明
May 25 Javascript
《JavaScript高级程序设计》阅读笔记(一) ECMAScript基础
Feb 27 Javascript
用JavaScript显示浏览器客户端信息的超相近教程
Jun 18 Javascript
javascript中Number的方法小结
Nov 21 Javascript
JavaScript中校验银行卡号的实现代码
Dec 19 Javascript
JS中Object对象的原型概念基础
Jan 29 Javascript
axios发送post请求,提交图片类型表单数据方法
Mar 16 Javascript
Vue循环组件加validate多表单验证的实例
Sep 18 Javascript
关于layui导航栏不展示下拉列表的解决方法
Sep 25 Javascript
javascript实现简单打字游戏
Oct 29 Javascript
javascript设计模式 ? 单例模式原理与应用实例分析
Apr 09 Javascript
AngularJS数据源的多种获取方式汇总
Feb 02 #Javascript
多种JQuery循环滚动文字图片效果代码
Jun 23 #Javascript
三种AngularJS中获取数据源的方式
Feb 02 #Javascript
原生JS实现拖拽图片效果
Aug 27 #Javascript
基于jquery实现下拉框美化特效
Feb 02 #Javascript
AngularJS自动表单验证
Feb 01 #Javascript
javascript实现右侧弹出“分享到”窗口效果
Feb 01 #Javascript
You might like
php模拟用户自动在qq空间发表文章的方法
2015/01/07 PHP
JavaScript 学习笔记 Black.Caffeine 09.11.28
2009/11/30 Javascript
基于jQuery的让非HTML5浏览器支持placeholder属性的代码
2011/05/24 Javascript
JS代码放在head和body中的区别分析
2011/12/01 Javascript
javascript中encodeURI和decodeURI方法使用介绍
2013/05/06 Javascript
JavaScript实现的使用键盘控制人物走动实例
2014/08/27 Javascript
深入理解javascript变量声明
2014/11/20 Javascript
JS及PHP代码编写八大排序算法
2016/07/12 Javascript
详解Python中logging日志模块在多进程环境下的使用
2016/12/26 Javascript
bootstrap 设置checkbox部分选中效果
2017/04/20 Javascript
Vue实现百度下拉提示搜索功能
2017/06/21 Javascript
理理Vue细节(推荐)
2019/04/16 Javascript
基于vue如何发布一个npm包的方法步骤
2019/05/15 Javascript
解决layer弹出层中表单不起作用的问题
2019/09/09 Javascript
vue+layui实现select动态加载后台数据的例子
2019/09/20 Javascript
Vue-cli项目部署到Nginx服务器的方法
2019/11/01 Javascript
JavaScript实现留言板案例
2020/03/17 Javascript
vue实现淘宝购物车功能
2020/04/20 Javascript
python使用webbrowser浏览指定url的方法
2015/04/04 Python
Python中利用sqrt()方法进行平方根计算的教程
2015/05/15 Python
在arcgis使用python脚本进行字段计算时是如何解决中文问题的
2015/10/18 Python
浅谈python和C语言混编的几种方式(推荐)
2017/09/27 Python
Python实现简单的文本相似度分析操作详解
2018/06/16 Python
Python实现将多个空格换为一个空格.md的方法
2018/12/20 Python
Python 监测文件是否更新的方法
2019/06/10 Python
pandas 时间格式转换的实现
2019/07/06 Python
都柏林通行卡/城市通票:The Dublin Pass
2020/02/16 全球购物
抄作业检讨书
2014/02/17 职场文书
《火烧云》教学反思
2014/04/12 职场文书
学生鉴定评语大全
2014/05/05 职场文书
消防安全宣传口号
2014/06/10 职场文书
学校欢迎标语
2014/06/18 职场文书
工作自我评价范文
2015/03/05 职场文书
2015年办公室工作总结范文
2015/03/31 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
Python实现排序方法常见的四种
2021/07/15 Python