廣義回調管理 · AngularJS學習筆記

### 11.2. 廣義回調管理和其它框架一樣， ng 提供了廣義的異步回調管理的機制。 _$http_ 服務是在其之上封裝出來的。這個機制就是 ng 的 _$q_ 服務。不過 ng 的這套機制總的來說實現得比較簡單，按官方的說法，夠用了。使用的方法，基本上是： - 通過 _$q_ 服務得到一個 _deferred_ 實例 - 通過 _deferred_ 實例的 _promise_ 屬性得到一個 _promise_ 對象 - _promise_ 對象負責定義回調函數 - _deferred_ 實例負責觸發回調 var TestCtrl = function($q){ var defer = $q.defer(); var promise = defer.promise; promise.then(function(data){console.log('ok, ' + data)}, function(data){console.log('error, ' + data)}); //defer.reject('xx'); defer.resolve('xx'); } 了解了上面的東西，再分別看 _$q_ ， _deferred_ ， _promise_ 這三個東西。 ### 11.2.1. $q _$q_ 有四個方法： - _$q.all()_ 合并多個 _promise_ ，得到一個新的 _promise_ - _$q.defer()_ 返回一個 _deferred_ 對象 - _$q.reject()_ 包裝一個錯誤，以使回調鏈能正確處理下去 - _$q.when()_ 返回一個 _promise_ 對象 _$q.all()_ 方法適用于并發場景很合適： var TestCtrl = function($q, $http){ var p = $http.get('/json', {params: {a: 1}}); var p2 = $http.get('/json', {params: {a: 2}}); var all = $q.all([p, p2]); p.success(function(res){console.log('here')}); all.then(function(res){console.log(res[0])}); } _$q.reject()_ 方法是在你捕捉異常之后，又要把這個異常在回調鏈中傳下去時使用：要理解這東西，先看看 _promise_ 的鏈式回調是如何運作的，看下面兩段代碼的區別： var defer = $q.defer(); var p = defer.promise; p.then( function(data){return 'xxx'} ); p.then( function(data){console.log(data)} ); defer.resolve('123'); var defer = $q.defer(); var p = defer.promise; var p2 = p.then( function(data){return 'xxx'} ); p2.then( function(data){console.log(data)} ); defer.resolve('123'); 從模型上看，前者是“并發”，后者才是“鏈式”。而 _$q.reject()_ 的作用就是觸發后鏈的 _error_ 回調： var defer = $q.defer(); var p = defer.promise; p.then( function(data){return data}, function(data){return $q.reject(data)} ). then( function(data){console.log('ok, ' + data)}, function(data){console.log('error, ' + data)} ) defer.reject('123'); 最后的 _$q.when()_ 是把數據封裝成 _promise_ 對象： var p = $q.when(0, function(data){return data}, function(data){return data}); p.then( function(data){console.log('ok, ' + data)}, function(data){console.log('error, ' + data)} ); ### 11.2.2. deferred _deferred_ 對象有兩個方法一個屬性。 - _promise_ 屬性就是返回一個 _promise_ 對象的。 - _resolve()_ 成功回調 - _reject()_ 失敗回調 var defer = $q.defer(); var promise = defer.promise; promise.then(function(data){console.log('ok, ' + data)}, function(data){console.log('error, ' + data)}); //defer.reject('xx'); defer.resolve('xx'); ### 11.2.3. promise _promise_ 對象只有 _then()_ 一個方法，注冊成功回調函數和失敗回調函數，再返回一個 _promise_ 對象，以用于鏈式調用。