Angularjs promise对象解析
1、先来看一段Demo,看完这个demo你可以思考下如果使用$.ajax如何处理同样的逻辑,使用ng的promise有何优势?
var ngApp=angular.module('ngApp',[]); /*******************************************************************
* $q为内置服务
****************************************************************/
ngApp.factory('UserInfoService',['$http','$q',function($http,$q){
return{
query:function(){
var defer=$q.defer(); //声明延后执行
$http({method:'GET',url:'data/students.json'}).
success(function(data,status,headers,config){
defer.resolve(data); //声明执行成功
console.log('UserInfoService success');
}).
error(function(data,status,headers,config){
defer.reject(); //声明执行失败
}); return defer.promise; //返回承诺,返回获取数据的API
}
}
}]); ngApp.controller('MainCtrl',['$scope','UserInfoService',function($scope,UserInfoService){
var promise = UserInfoService.query(); //同步调用,获取承诺接口
promise.then(function(data){
$scope.user=data; //调用承诺接口resolove()
console.log('MainCtrl ...');
},function(data){
$scope.user={error:'数据不存在。。。'}; //调用承诺接口reject();
}); }]);
2、什么是promise?
promise是一种用异步的方式处理值的方法,promise是对象,代表了一个函数最终可能的返回值或者抛出的异常,在与远程对象打交道时我们可以把他看作是远程对象的一个代理。 如果说是promise也是异步处理方式的一种,那么我们会想起它和XHR和$.ajax有啥区别呢?
习惯上js使用闭包或者回调来相应非同步返回的数据,比如页面加载之后的XHR请求。我们可以跟数据进行正常交互,就好像它已经返回了一样,而不需要依赖回调函数的触发。
那么ng提出的promise是为了解决什么问题呢? 回调已经被使用了很长时间,通常如果有回调依赖其他还回调时将会时调试变得非常艰难,每一步调用之后都需要显示处理错误。与之不同的是promise提供了另外一个抽象:这些函数返回promise对象。
从一定层面上看ng改变的不是简单的改变代码风格,而是让我对一些思维习惯发起了反思和改善。
回调示例
User.get(fromId,{
success:function(){
user.friends.find(toId,function(){})
},
failure:function(){}
})
ng promise示例
User.get(fromId).
then(function(user){ },function(err){ }).
then(function(){},function(){});
3、为什么使用promise
使用了promise的收获之一是逃脱了回调的固定思维逻辑。promise让异步处理的机制看上去更像是同步,基于同步函数我们可以按照预期来捕获返回值和异常值。可以在程序中的任何时刻捕捉错误,并且绕过依赖于程序异常的后续代码,我们不需要思考这个同步带来的好处。因此使用promise的目的是:获取功能组合和错误冒泡能力的同时,保持代码异步运行的能力。
promise是头等对象,自带了一些约定。
- 只有一个resolve或者reject会被调用到。
- 如果promise被执行或者被拒绝了,依赖于他们的处理程序仍然会被调用。
- 处理程序总是会被异步调用。
4、如何创建promise
想要在angularjs中创建promise,可以使用内置的$q服务,$q服务在它的deferred API中提供了一些方法。
首先把它注入到你想使用它的对象中
angular.module('ngApp',[]).
factory('UserInfoService',['$q',function($q){
//code here
}])
要创建一个deferred对象,可以调用defer()方法; var deferred= $q.defer();
deferred对象暴露了三个方法,以及一个可以用于处理promise的promise属性。
- resolve(value)。 deferred.resolve({name:"Kobe",Age:36});
- reject(reason)。 deferred.reject("Can't update user");
- notify(value)。这个方法用promise的执行状态进行响应。
- then(successFn,errFn,notifyFn)。
- catch(errFn)。
- finally(callback)。finally允许我们观察promise的执行或者拒绝,而无需修改结果的值。通常就做一些资源的清理工作。
5、链式请求
GitHubService.then(function(data){ }).then(function(data){
$scope.Users=data;
});
Angularjs promise对象解析的更多相关文章
- angularJS中的Promise对象($q)的深入理解
原文链接:a better way to learn AngularJS - promises AngularJS通过内置的$q服务提供Promise编程模式.通过将异步函数注册到promise对象, ...
- ECMAScript6的Promise对象
1. 概念 Promise对象用于异步(asynchronouss)计算,一个Promise对象代表着一个还未完成,但预期完成的操作. 2. 出现原因: 1) 如果你需要通过ajax发送多次请求,而 ...
- angularJS promise $q
Promise 一 介绍 1.什么是promise 我们知道JavaScript语言的执行环境是“单线程”,所谓单线程,就是一次只能够执行一个任务,如果有多个任务的话就要排队,前面一个任务完成后才可以 ...
- Angular通信$q服务和promise对象
promise 约定(promise)是一个对象,表示在未来时间点会发生的某件事情,约定可以是三种状态之一:等待.完成或拒绝.约定将从等待状态开始,然后可以转换为完成或者拒绝状态,一旦约定完成或者被拒 ...
- angularjs promise详解
一.什么是Promise Promise是对象,代表了一个函数最终可能的返回值或抛出的异常,就是用来异步处理值的. Promise是一个构造函数,自己身上有all.reject.resolve这几个异 ...
- 前端笔记之ES678&Webpack&Babel(下)AMD|CMD规范&模块&webpack&Promise对象&Generator函数
一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.j ...
- Promise原理讲解 && 实现一个Promise对象 (遵循Promise/A+规范)
1.什么是Promise? Promise是JS异步编程中的重要概念,异步抽象处理对象,是目前比较流行Javascript异步编程解决方案之一 2.对于几种常见异步编程方案 回调函数 事件监听 发布/ ...
- ES6之Promise对象学习——8个例子学会Promise
目录 Promise 立即执行 Promise 三种状态 Promise 不可逆性 链式调用 Promise.then()回调异步性 Promise中的异常 Promise.resolve() res ...
- 16. Promise对象
目录 Promise对象 一.含义 1. Promise是什么 2. 实例讨论 二.Promise特性案例解析 1. Promise的立即执行性 2. promise的三种状态 3. Promise的 ...
随机推荐
- Linux tar文件打包
tar格式,会打包成一个文件,可以对多个目录,或者多个文件进行打包 tar命令只是打包,不会压缩,打包前后大小是一样的 tar命令 -c //打包 -x //解压 -f //指定文件 ...
- 在 IIS 7.5 中,应用程序池有两种运行模式:集成模式和经典模式。
应用程序池模式会影响服务器处理托管代码请求的方式. 如果托管应用程序在采用集成模式的应用程序池中运行,服务器将使用 IIS 和 ASP.NET 的集成请求处理管道来处理请求. 如果托管应用程序在采用经 ...
- SharePoint 2010 Survey的Export to Spreadsheet功能怎么不见了?
背景信息: 最近用户报了一个问题,说他创建的Survey里将结果导出成Excel文件(Export to spreadsheet)的按钮不见了. 原因排查: 正常情况下,这个功能只存在于SharePo ...
- java线程学习
线程概念 当我问别人什么是线程的时候,别人给我讲了一大堆线程如何创建,如何使用以及若干线程的高深问题,其实作为一个资深菜鸟,我就想问问,什么是线程而已,找了书中的一些概念总结了一下,多线程与操作系统中 ...
- iOS开发系列--C语言之指针
概览 指针是C语言的精髓,但是很多初学者往往对于指针的概念并不深刻,以至于学完之后随着时间的推移越来越模糊,感觉指针难以掌握,本文通过简单的例子试图将指针解释清楚,今天的重点有几个方面: 什么是指针 ...
- Linux LVM逻辑卷
概述 LVM的产生是因为传统的分区一旦分区好后就无法在线扩充空间,也存在一些工具能实现在线扩充空间但是还是会面临数据损坏的风险:传统的分区当分区空间不足时,一般的解决办法是再创建一个更大的分区将原分区 ...
- AngularJs项目文件以及文件夹结构
app/ ----- Libs/ // references for all libs ---------- angular.js ---------- angular-route.js ----- ...
- zookeeper分布式锁原理
一.分布式锁介绍分布式锁主要用于在分布式环境中保护跨进程.跨主机.跨网络的共享资源实现互斥访问,以达到保证数据的一致性. 二.架构介绍在介绍使用Zookeeper实现分布式锁之前,首先看当前的系统架构 ...
- 《Entity Framework 6 Recipes》中文翻译系列 (24) ------ 第五章 加载实体和导航属性之查询内存对象
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 5-4 查询内存对象 问题 你想使用模型中的实体对象,如果他们已经加载到上下文中, ...
- Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析
这是关于RecyclerView的第二篇,说的是如何自定义Item动画,但是请注意,本文不包含动画的具体实现方法,只是告诉大家如何去自定义动画,如何去参考源代码. 我们知道,RecyclerView默 ...