浅谈Angular的$q, defer, promise
1. $q
$q是Angular的一种内置服务,它可以使你异步地执行函数,并且当函数执行完成时它允许你使用函数的返回值(或异常)。
2. defer
defer的字面意思是延迟,$q.defer() 可以创建一个deferred实例(延迟对象实例)。
deferred 实例旨在暴露派生的Promise 实例,以及被用来作为成功完成或未成功完成的信号API,以及当前任务的状态。这听起来好复杂的样子,总结$q, defer, promise三者之间的关系如下所示。
var deferred = $q.defer(); //通过$q服务注册一个延迟对象 deferred var promise = deferred.promise; //通过deferred延迟对象,可以得到一个承诺promise,而promise会返回当前任务的完成结果
defer的方法:
- deferred.resolve(value) 成功解决(resolve)了其派生的promise。参数value将来会被用作promise.then(successCallback(value){...}, errorCallback(reason){...}, notifyCallback(notify){...})中successCallback函数的参数。
- deferred.reject(reason) 未成功解决其派生的promise。参数reason被用来说明未成功的原因。此时deferred实例的promise对象将会捕获一个任务未成功执行的错误,promise.catch(errorCallback(reason){...})。补充一点,promise.catch(errorCallback)实际上就是promise.then(null, errorCallback)的简写。
- notify(value) 更新promise的执行状态(翻译的不好,原话是provides updates on the status of the promise's execution)
defer的小例子:
function asyncGreet(name) { var deferred = $q.defer(); //通过$q.defer()创建一个deferred延迟对象,在创建一个deferred实例时,也会创建出来一个派生的promise对象,使用deferred.promise就可以检索到派生的promise。 deferred.notify('About to greet ' + name + '.'); //延迟对象的notify方法。 if (okToGreet(name)) { deferred.resolve('Hello, ' + name + '!'); //任务被成功执行 } else { deferred.reject('Greeting ' + name + ' is not allowed.'); //任务未被成功执行 } return deferred.promise; //返回deferred实例的promise对象 } function okToGreet(name) { //只是mock数据,实际情况将根据相关业务实现代码 if(name == 'Superman') return true; else return false; } var promise = asyncGreet('Superman'); //获得promise对象 //promise对象的then函数会获得当前任务也就是当前deferred延迟实例的执行状态。它的三个回调函数分别会在resolve(), reject() 和notify()时被执行 promise.then(function(greeting) { alert('Success: ' + greeting); }, function(reason) { alert('Failed: ' + reason); }, function(update) { alert('Got notification: ' + update); });
3. promise
当创建一个deferred实例时,promise实例也会被创建。通过deferred.promise就可以检索到deferred派生的promise。
promise的目的是允许interested parties 访问deferred任务完成的结果。
按照CommonJS的约定,promise是一个与对象交互的接口,表示一个动作(action)的结果是异步的,而且在任何给定的时间点上可能或不可能完成。(这句话好绕口,我的理解是promise相当于一个承诺,承诺你这个任务在给定的时间点上可能会完成,也可能完成不了。如果完成了那就相当于resolve, 如果未完成就相当于reject。不知道这样理解对不对?)
promise 的方法:
- then(successCallback, errorCallback, nitifyCallback) 根据promise被resolve/reject,或将要被resolve/reject,调用successCallback/errorCallback。
- catch(errorCallback) then(null, errorCallback)的缩写。
- finally(callback, notifyCallback)
补充说明:
promise.then()会返回一个新的衍生promise,形成promise链。例如: promiseB = promiseA.then(function(result) { return result + 1; }); // promiseB will be resolved immediately after promiseA is resolved and its value // will be the result of promiseA incremented by 1
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!
- AngularJS中update两次出现$promise属性无法识别的解决方法
- AngularJS中的Promise详细介绍及实例代码
- AngularJS 中的Promise --- $q服务详解
- 详解Javacript和AngularJS中的Promises
- AngularJS中处理多个promise的方式
- Angular中的Promise对象($q介绍)
- 浅析Angular2子模块以及异步加载
- 详解Angular.js的$q.defer()服务异步处理
- AngularJS出现$http异步后台无法获取请求参数问题的解决方法
- AngularJS 实现按需异步加载实例代码
- angularjs 处理多个异步请求方法汇总
- AngularJS中的promise用法分析
相关文章
angularJS自定义directive之带参方法传递详解
今天小编就为大家分享一篇angularJS自定义directive之带参方法传递详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2018-10-10AngularJS与BootStrap模仿百度分页的示例代码
分页在很多时候都能用到,这篇文章主要介绍了AngularJS与BootStrap模仿百度分页的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧2018-05-05angular基于ng-alain定义自己的select组件示例
这篇文章主要介绍了angular基于ng-alain定义自己的select组件示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧2018-02-02
最新评论