AngularJS 中的Promise --- $q服务详解
什么是Promise
Javascript中异步的实现方式有很多,延时函数、回调函数、以及es6新增的生成器函数,其中Promise也是实现异步的方式之一。
关于javascript中的异步实现方式的详解以及区别,后期会更新博客,敬请期待,此处不再赘述。
$q服务
简言之$q服务是AngularJS中自己封装实现的一种Promise实现。先介绍一下$q常用的几个方法:
defer() 创建一个deferred对象,这个对象可以执行几个常用的方法,比如resolve,reject,notify等
all() 传入Promise的数组,批量执行,返回一个promise对象
when() 传入一个不确定的参数,如果符合Promise标准,就返回一个promise对象。
需要注意的是在Promise中,定义了三种状态:等待状态,完成状态,拒绝状态。 关于状态有两个规定:1.状态的变更是不可逆的2.等待状态可以变成完成或者拒绝
defer()方法
在$q中,可以使用resolve方法,变成完成状态;使用reject方法,变成拒绝状态。
其中defer()用于创建一个deferred对象,defer.promise用于返回一个promise对象,来定义then方法。then中有三个参数,分别是成功回调、失败回调、状态变更回调。
下面看一个公司项目遇到的实例:
function getJson(jsonPath) { var def = $q.defer(); $http.get(jsonPath) .then(function (resp) { def.resolve(resp.data); }).catch(function () { def.reject(err); }); return def.promise; }; function goNext(num) { console.log('next:',num) }; getJson('./json/xiansuotibao.json').then(function (obj) { goNext(obj); });
这样就把两个函数的同步执行,变成了异步执行。
all()方法
这个all()方法,可以把多个primise的数组合并成一个。当所有的promise执行成功后,会执行后面的回调。回调中的参数,是每个promise执行的结果。
当批量的执行某些方法时,就可以使用这个方法。
var funcA = function(){ var def = $q.defer(); console.log("funcA"); //some code return def.promise; } var funcB = function(){ var def = $q.defer(); console.log("funcA"); //some code return def.promise; } $q.all([funcA(),funcB()]) .then(function(result){ console.log(result); });