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中有三个参数，分别是成功回调、失败回调、状态变更回调。
下面看一个公司项目遇到的实例：

‘use strict‘;angular.module(‘app‘) ???.controller(‘positionCtrl‘,[‘$scope‘,‘$state‘,‘$q‘,‘$stateParams‘,‘$http‘,function ($scope,$state,$q,$stateParams,$http) { ???????var vm = this; ???????vm.position; ???????vm.company; ???????vm.isLogin = false; ???????function getPosition() { ???????????var def = $q.defer(); ???????????$http.get(‘/data/position.json?id = ‘ + $stateParams.id) ???????????????.then(function (resp) { ???????????????????vm.position = resp.data; ???????????????????// console.log(resp.data); ???????????????????// console.log(vm.position); ???????????????????def.resolve(resp); ???????????????}).catch(function () { ???????????????def.reject(err); ???????????}); ???????????return def.promise; ???????}; ???????function getCompany(id) { ???????????$http.get(‘data/company.json?id=‘+id) ???????????????.then(function (resp) { ???????????????????vm.company = resp.data; ???????????????????// console.log(vm.company); ???????????????}) ???????????????.catch(function (err) { ???????????????????console.log(err); ???????????}); ???????}; ???????getPosition().then(function (obj) { ???????????getCompany(obj.companyId); ???????}); ???}]);

上述代码业务逻辑其实很简单，首先要获取公司职位vm.position，根据职位信息中的companyId来获取公司vm.company。
在第一个函数中getPosition中，首先调用$q.defer()方法得到一个deferred对象。 return def.promise;语句很显然使得函数getPosition返回一个Promise对象，这样在调用 getPosition()函数之后可以直接使用.then()方法。

 getPosition().then(function (obj) { ???????????getCompany(obj.companyId); ???????});

这样就把两个函数的同步执行，变成了异步执行。

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); ???????????});