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之拖拽插件实现代码
Apr 14 Javascript
javascript的字符串按引用复制和传递,按值来比较介绍与应用
Dec 28 Javascript
javascript 实现键盘上下左右功能的小例子
Sep 15 Javascript
浅谈javascript中createElement事件
Dec 05 Javascript
JS动态日期时间的获取方法
Sep 28 Javascript
jQuery+PHP+MySQL二级联动下拉菜单实例讲解
Oct 27 Javascript
jQuery特殊符号转义的实现
Nov 30 Javascript
AngularJS框架的ng-app指令与自动加载实现方法分析
Jan 04 Javascript
微信小程序去哪里找 小程序到底如何使用(附小程序名单)
Jan 09 Javascript
Javascript 两种刷新方法以及区别和适用范围
Jan 17 Javascript
解决在Vue中使用axios用form表单出现的问题
Oct 30 Javascript
jQuery实现手风琴特效
Jan 11 jQuery
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+MySQL判断update语句是否执行成功的方法
2014/08/28 PHP
PHP书写格式详解(必看)
2016/05/23 PHP
PHP抓取远程图片(含不带后缀的)教程详解
2016/10/21 PHP
Javascript中Eval函数的使用说明
2008/10/11 Javascript
Javascript冒泡排序算法详解
2014/12/03 Javascript
jQuery $.each遍历对象、数组用法实例
2015/04/16 Javascript
jQuery解决input超多的表单提交
2015/08/10 Javascript
jQuery 获取多选框的值及多选框中文的函数
2016/05/16 Javascript
javascript类型系统——undefined和null全面了解
2016/07/13 Javascript
jQuery中的一些小技巧
2017/01/18 Javascript
原生JS实现的多个彩色小球跟随鼠标移动动画效果示例
2018/02/01 Javascript
nodejs实现超简单生成二维码的方法
2018/03/17 NodeJs
JS原生瀑布流效果实现
2019/04/26 Javascript
vue实现路由懒加载及组件懒加载的方式
2019/06/11 Javascript
vue路由切换之淡入淡出的简单实现
2019/10/31 Javascript
使用nodejs实现JSON文件自动转Excel的工具(推荐)
2020/06/24 NodeJs
[01:02:47]EG vs Secret 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.21.mp4
2020/07/19 DOTA
python共享引用(多个变量引用)示例代码
2013/12/04 Python
php使用递归与迭代实现快速排序示例
2014/01/23 Python
Python操作MySQL数据库的三种方法总结
2018/01/30 Python
python爬取指定微信公众号文章
2018/12/20 Python
python正则表达式匹配[]中间为任意字符的实例
2018/12/25 Python
对python中xlsx,csv以及json文件的相互转化方法详解
2018/12/25 Python
python矩阵运算,转置,逆运算,共轭矩阵实例
2020/05/11 Python
python 递归相关知识总结
2021/03/03 Python
鲜为人知的HTML5语音合成功能
2019/05/17 HTML / CSS
Canvas制作的下雨动画的示例
2018/03/06 HTML / CSS
雅诗兰黛美国官网:Estee Lauder美国
2016/07/21 全球购物
香港卓悦化妆品官网:BONJOUR
2017/09/21 全球购物
goodhealth官方海外旗舰店:新西兰国民营养师
2017/12/15 全球购物
资深财务管理人员自我评价
2013/09/22 职场文书
管理学专业个人求职信范文
2013/12/13 职场文书
论文诚信承诺书
2014/05/23 职场文书
委托证明书
2014/09/17 职场文书
四大名著读书笔记
2015/06/25 职场文书
MySQL 全文索引使用指南
2021/05/25 MySQL