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 相关文章推荐
JS动画效果代码3
Apr 03 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
JavaScript知识点总结(四)之逻辑OR运算符详解
May 31 Javascript
AngularJs定制样式插入到ueditor中的问题小结
Aug 01 Javascript
BootStrap Tooltip插件源码解析
Dec 27 Javascript
bootstrap table表格使用方法详解
Apr 26 Javascript
详解使用路由延迟加载 Angular 模块
Oct 12 Javascript
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
vue的路由映射问题及解决方案
Oct 14 Javascript
JavaScript判断数组类型的方法
Oct 23 Javascript
Ajax异步刷新功能及简单案例
Nov 20 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 保留小数点
2009/04/21 PHP
PHP 用session与gd库实现简单验证码生成与验证的类方法
2016/11/15 PHP
ThinkPHP3.2.3框架实现的空模块、空控制器、空操作,跳转到错误404页面图文详解
2019/04/03 PHP
解析js中获得父窗口链接getParent方法以及各种打开窗口的方法
2013/06/19 Javascript
浅谈checkbox的一些操作(实战经验)
2013/11/20 Javascript
jQuery 滑动方法slideDown向下滑动元素
2014/01/16 Javascript
jQuery中:button选择器用法实例
2015/01/04 Javascript
JS+CSS实现感应鼠标渐变显示DIV层的方法
2015/02/20 Javascript
Js与Jq 获取页面元素值的方法和差异对比
2015/04/30 Javascript
jquery+CSS实现的多级竖向展开树形TRee菜单效果
2015/08/24 Javascript
JS实现复制内容到剪贴板功能兼容所有浏览器(推荐)
2016/06/17 Javascript
js中的关联数组与普通数组详解
2016/07/27 Javascript
Vue方法与事件处理器详解
2016/12/01 Javascript
Angularjs 动态改变title标题(兼容ios)
2016/12/29 Javascript
webpack独立打包和缓存处理详解
2017/04/03 Javascript
jquery easyui如何实现格式化列
2017/07/30 jQuery
微信小程序wx.previewImage预览图片实例详解
2017/12/07 Javascript
在vue中使用css modules替代scroped的方法
2018/03/10 Javascript
一个简单的node.js界面实现方法
2018/06/01 Javascript
vue-cli构建vue项目的步骤详解
2019/01/27 Javascript
python基础教程之字典操作详解
2014/03/25 Python
简单了解python数组的基本操作
2019/11/26 Python
Tensorflow限制CPU个数实例
2020/02/06 Python
python利用Excel读取和存储测试数据完成接口自动化教程
2020/04/30 Python
详解python tcp编程
2020/08/24 Python
利用SVG和CSS3来实现一个炫酷的边框动画
2015/07/22 HTML / CSS
瑞士领先的网上超市:LeShop.ch
2018/11/14 全球购物
Footshop乌克兰:运动鞋的最大选择
2019/12/01 全球购物
安全协议书范本
2014/04/21 职场文书
民族团结演讲稿范文
2014/08/27 职场文书
委托书的写法
2014/08/30 职场文书
法定代表人资格证明书
2015/06/18 职场文书
本科毕业论文答辩稿
2015/06/23 职场文书
领导干部学习十八届五中全会精神心得体会
2016/01/05 职场文书
2019大学生社会实践报告汇总
2019/08/16 职场文书
导游词之镇江-金山寺
2019/10/14 职场文书