详见:http://www.imooc.com/code/8907

JavaScript的执行流程是分为"同步"与"异步"

传统的异步操作会在操作完成之后,使用回调函数传回结果,而回调函数中则包含了后续的工作。这也是造成异步编程困难的主要原因:

我们一直习惯于“线性”地编写代码逻辑,但是大量异步操作所带来的回调函数,会把我们的算法分解地支离破碎。

嵌套式回调

动画为例,下一个动画要等上一个执行完毕才可以继续,流程就会写到回调里面

//执行多个动画
$('ele1').animate({  
opacity: '.5'
}, 4000, function() {  
$('ele2').animate({  
width: '100px'
}, 2000, function() {  
$('ele3').animate({  
height: '0'
}, 2000);
});
});

上面的代码编程逻辑也是正确的,但是针对这样的异步嵌套的回调逻辑,当我们的嵌套越多,代码结构层级会变得越来越深。首先是阅读上会变得困难,其次是强耦合,接口变得不好扩展。我们需要一种模式来解决这种问题,这就是Promises所要做的事情。

为了让前端们从回调的地狱中回到天堂, jQuery 也引入了 Promise 的概念。 Promise 是一种令代码异步行为更加优雅的抽象,有了它,我们就可以像写同步代码一样去写异步代码。这个东东看起来很复杂,实际上我们只要抓住核心的使用就可以了

观察右边代码:

通过$.Deferred处理过的代码,很明显没有了回调的嵌套,虽然代码量看起来多了点,但是实际上,每一个代码执行部分都被封装了起来,只留了Deferred的接口处理了,等于是我们把执行的流程控制交给了Deferred,这样的好处就是我们在写嵌套函数的时候,可以用deferred提供的管道风格编写同步代码了

dtd.then(function() {
  //操作1
}).then(function() {
  //操作2
}).then(function() {
  //操作3
})

这里要了解3个步骤

var dtd = $.Deferred(); //创建
dtd.resolve(); //成功
dtd.then() //执行回调

jQuery之Deferred对象的使用的更多相关文章

  1. jQuery的deferred对象详解

    jQuery的deferred对象详解请猛击下面的链接 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_ ...

  2. jQuery的deferred对象学习

    #copy { background-color: lightgreen; padding: 15px; margin: 10px } 一.deferred对象简介 deferred对象是jquery ...

  3. jQuery的deferred对象详解(转载)

    本文转载自: jQuery的deferred对象详解(转载)

  4. jQuery的deferred对象

    应用场景:处理异步任务 看到一篇阮一峰老师的博客挺好的讲的就是jQuery的deferred对象.坦诚讲之前没有怎么用过这个东东呢. 摘其中几点记录下 (1) $.Deferred() 生成一个def ...

  5. jQuery的deferred对象详解(一)

    最近一段时间,都在研究jquery里面的$.Deffered对象,几天都搞不明白,其中源码的运行机制,网上查找了相关的资料,<jQuery的deferred对象详解>阮一峰老师的文章,里面 ...

  6. jQuery的deferred对象解析

    参考: jQuery的deferred对象详解:http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_defe ...

  7. [转] jQuery的deferred对象详解

    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. ...

  8. jQuery的deferred对象详解(转)

    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本. 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5.0版本开始引入的一个新功能----deferred对象. ...

  9. jQuery的deferred对象详解 jquery回调函数

    http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html jQuery的 ...

  10. jQuery的deferred对象详解(转载)

    jQuery的开发速度很快,几乎每半年一个大版本,每两个月一个小版本.(由于无法转载,复制原文 .原文链接——原作者:阮一峰) 每个版本都会引入一些新功能.今天我想介绍的,就是从jQuery 1.5. ...

随机推荐

  1. Android google map 两点之间的距离

    在Android google map中,有时候会碰到计算两地的距离,下面的辅助类就可以帮助你计算距离: public class DistanceHelper { /** Names for the ...

  2. SharePoint 2013 Nintex Workflow 工作流帮助(十一)

    博客地址 http://blog.csdn.net/foxdave 工作流动作 27. Create item in another site(Libraries and lists分组) 该操作用于 ...

  3. 理解NSTextContainer

    Apple的Doc对这个类的描述是这样的: The NSTextContainer class defines a region where text is laid out. An NSLayout ...

  4. javascript splice

    //arrayObject.splice(index,howmany,element1,.....,elementX)//index 必需.规定从何处添加/删除元素.(0)//howmany 必需.规 ...

  5. 使用respondsToSelector:来发现对象是否响应消息

    发现对象是否响应消息 要发现一个对象是否响应一则消息,请在该对象上调用 respondsToSelector: 方法.应用程序代码通常验证一个对象响应一则消息后,才将消息发送给该对象. if ([it ...

  6. bootstrap菜单完美解决---原创

    由于bootstrap的各方优点,偶的“点金项目细化分包管理平台”决定采用它.但在使用中遇到了一些问题,比如菜单的问题,这个菜单是用的一个JQuery的一个效果,点击后,所点击的链接处的class要加 ...

  7. Android无限循环轮播广告位Banner

     Android无限循环轮播广告位Banner 现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络.这个广告位banner ...

  8. C#操作指针

    如何:递增和递减指针 使用增量和减量运算符 ++ 和 -- 可以将 pointer-type* 类型的指针的位置改变 sizeof (pointer-type). 增量和减量表达式的形式如下: ++p ...

  9. C++ QUICK REFERENCE

    C++ string 用法详解 字符串分割(C++)  C++ QUICK REFERENCE Matt Mahoney, mmahoney@cs.fit.edu DECLARATIONS enum ...

  10. Ubuntu14.04安装配置Open vSwitch

    最近在研究学习Open vSwitch,准备在本地Ubuntu14.04机器上安装一下,并基于其创建一些KVM虚拟机,下面就简要记录下在Ubuntu14.04系统上安装Open vSwitch的过程. ...