jQuery Deferred和Promise创建响应式应用程序详细介绍

2020-05-22 15:18:24易采站长站整理


when(
promise1,
promise2,

).then(function( futureValue1, futureValue2, … ) {
/* all promises have completed and are resolved */
});

一个很好的例子是这样一个场景,你可能同时有多个正在运行的动画。 如果不跟踪每个动画执行完成后的回调,很难做到在动画完成后执行下一步任务。然而使用promise和‘when’方式却可以很直截了当的表示: 一旦动画执行完成,就可以执行下一步任务。最终的结果是我们可以可以简单的用一个回调来解决多个动画执行结果的等待问题。 例如:

when( function(){
/* animation 1 */
/* return promise 1 */
}, function(){
/* animation 2 */
/* return promise 2 */
} ).then(function(){
/* once both animations have completed we can then run our additional logic */
});

这意味着,基本上可以用非阻塞的逻辑方式编写代码并异步执行。 而不是直接将回调传递给函数,这可能会导致紧耦合的接口,通过promise模式可以很容易区分同步和异步的概念。
  在下一节中,我们将着眼于jQuery实现的deferreds,你可能会发现它明显比现在所看到的promise模式要简单。
jQuery的Deferreds
  jQuery在1.5版本中首次引入了deferreds。它 所实现的方法与我们之前描述的抽象的概念没有大的差别。原则上,你获得了在未来某个时候得到‘延时’返回值的能力。在此之前是无法单独使用的。 Deferreds 作为对ajax模块较大重写的一部分添加进来,它遵循了CommonJS的promise/ A设计。1.5和先前的版本包含deferred功能,可以使$.ajax() 接收调用完成及请求出错的回调,但却存在严重的耦合。开发人员通常会使用其他库或工具包来处理延迟任务。新版本的jQuery提供了一些增强的方式来管理 回调,提供更加灵活的方式建立回调,而不用关心原始的回调是否已经触发。 同时值得注意的是,jQuery的递延对象支持多个回调绑定多个任务,任务本身可以既可以是同步也可以是异步的。
  您可以浏览下表中的递延功能,有助于了解哪些功能是你需要的:















jQuery.Deferred()创建一个新的Deferred对象的构造函数,可以带一个可选的函数参数,它会在构造完成后被调用。
jQuery.when()通过该方式来执行基于一个或多个表示异步任务的对象上的回调函数
jQuery.ajax()执行异步Ajax请求,返回实现了promise接口的jqXHR对象
deferred.then(resolveCallback,rejectCallback)添加处理程序被调用时,递延对象得到解决或者拒绝的回调。