详见: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. SQL Server 语句整理

    1. 创建数据库 create database dbName 2. 删除数据库 drop database dbName 3. 备份sql server --- 创建 备份数据的 device US ...

  2. 无刷新 checkbox列表的删除

    前台 JS : function ModelDelete() { var checkvalues = null; var checValue = $("#dom1").find(& ...

  3. 《Java7中 下划线的新特性》

    //Java7引入了一个新功能:程序员可以在数值中使用下画线,不管是 //整形数值,还是浮点型数值,都可以自由地使用下划线.通过下划线 //分隔,可以更直观的分辨数值中到底有多少位. public c ...

  4. jQuery中 判断事件

    $('button.top').on('mousedown', function() { var $this = $(this); if ($this.hasClass('settop')) { $t ...

  5. struts2DMI(动态方法调用)

    DMI(Dynamic Method Invoke)即动态,是strus2的一个特性,我们知道,在最开始学习strus2时,往往一个action中只有一个excute方法,比如说add,delete, ...

  6. android avoiding-memory-leaks

    android avoiding-memory-leaks Memory Leak是会有多个方面会引起的,比如Drawable, RemoteViews, Receiver, Cursor,Input ...

  7. String to Integer (atoi) ---- LeetCode 008

    Implement atoi to convert a string to an integer. Hint: Carefully consider all possible input cases. ...

  8. YII2.0上传文件

    针对于YII2.0官方手册来说,我稍微修改了一些内容具体的就是把model层里定义的uoload方法在controller方法里合并了 创建模型 namespace app\models; use y ...

  9. Linux下拷贝目录和删除

    cp命令用于复制文件或目录,若同事指定两个以上的文件或目录,切最后一个目的地是一个已存在的目录,则它会把前面指定的所有文件或目录复制到此目录中.若同时指定多个文件或目录,而最后的目的地并非一个已存在的 ...

  10. java IO流的体系结构图

    常用字节流字符流 字节流   InputStream                                                                           ...