promise是Javascript异步编程很好的解决方案。对于一个异步方法,执行一个回调函数。比如页面调用google地图的api时就使用到了promise。 function success(position){ var cords = position.coords; ...
promise是Javascript异步编程很好的解决方案。对于一个异步方法,执行一个回调函数。比如页面调用google地图的api时就使用到了promise。
function success(position){ var cords = position.coords; console.log(coords.latitude + coords.longitude);}function error(err){ console.warn(err.code+err.message)}navigator.geolocation.getCurrentPosition(success, error);
如果有很多异步方法需要按序执行呢?async1(success, failure), async2(success, failure), ...asyncN(success, failure),该
如何处理呢?最简单的,可能会这样写:
async1(function(){ async2(function(){ ... asyncN(null, null); ... }, null)}, null)
我们可以让所有的异步方法执行完毕后出来一个通知。
var counter = N;function success(){ counter--; if(counter === 0){ alert('done'); }}async1(success);async2(success);...asyncN(success);
deferred表示异步操作的结果,提供了一个显示操作结果和状态的
接口,并提供了一个可以获取该操作结果相关的promise实例。deferred是可以改变操作状态的。promise提供了一个用来和相关deferred交互的接口。当创建一个deferred,相当于一个pending状态;我们可以在创建deferred之后,定义回调函数,而回调函数在得到resolved和rejected的状态提示后开始执行。异步方法不需要知道回调函数如何操作,只需要在得到resolved或rejected状态后通知回调函数开始执行。■ 基本用法→ 创建deferredvar myFirstDeferred = $q.defer();这里,对于myFirstDeferred这个deferred,状态是pending,接下来,当异步方法执行成功,状态变成resolved,当异步方法执行失败,状态变成rejected。→ Resolve或Reject这个dererred假设有这样的一个异步方法:async(success, failure)
async(function(value){ myFirstDeferred.resolve(value);}, function(errorReason){ myFirstDeferred.reject(errorReason);})
async(myFirstDeferred.resolve, myFirstDeferred.reject);→ 使用deferred中的promise
var myFirstPromise = myFirstDeferred.promise;myFirstPromise .then(function(data){ }, function(error){ })
→ 通常把异步方法包裹到一个函数中
function getData(){ var deferred = $q.defer(); async(deferred.resolve,deferred.reject); return deferred.promise;}//deferred的promise属性记录了达到resolved, reject状态所需要执行的success和error方法var dataPromise = getData();dataPromise .then(function(data){ console.log('success'); }, function(error){ console.log('error'); })
假设有一个异步方法,使用deferred.resolve返回一个值。
function async(value){ var deferred = $q.defer(); var result = value / 2; deferred.resolve(result); return deferred.promise;}
■ Promise链式
function async1(value){ var deferred = $q.defer(); var result = value * 2; deferred.resolve(result); return deferred.promise;}function async2(value){ var deferred = $q.defer(); var result = value + 1; deferred.resolve(result); return deferred.promise;}var promise = async1(10) .then(function(x){ return async2(x); }) promise.then(function(x){ console.log(x);})
如果从捕获异常的角度,还可以这样写:
async1() .then(async2) .then(async3) .catch(handleReject) .finally(freeResources);
使用该方法能够让deferred呈现error状态,并给出一个出现error的理由。
var promise = async().then(function(value){ if(true){ return value; } else { return $q.reject('value is not satisfied'); }})
返回一个promise并带上值。
function getDataFromBackend(query){ var data = searchInCache(query); if(data){ return $q.when(data); } else { reutrn makeAasyncBackendCall(query); }}
等待所有promise执行完成。
var allPromise = $q.all([ async1(), async2(), ... asyncN();])allProise.then(function(values){ var value1 = values[0], value2 = values[1], ... valueN = values[N]; console.log('all done');})
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:Javacript和AngularJS中的Promises
关键词:JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。