位置: 编程技术 - 正文
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题(jquery的deferred)
编辑：rootadmin推荐整理分享以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题(jquery的deferred)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:jquery defered,jquery defered,jquery中有几种方法可以来设置和获取样式,jquery deffered,jquery的deferred,jquery的deferred,在jquery中fadein,jquery的deferred,内容如对您有帮助，希望把文章链接给更多的朋友！
Promises是一种令代码异步行为更加优雅的抽象，它很有可能是JavaScript的下一个编程范式，一个Promise即表示任务结果，无论该任务是否完成。
在一些现代浏览器中已经提供了原生的Promise对象，其遵循Promise/A+标准。在jQuery1.5+，提供了$.Deferred（其可以被转化为promise对象）。很多知名的框架中，也提供了promise对象。promise对象在javascript中已经是一种很重要的模式，它在解决异步问题时表现出的优雅，正是javascript所需要的。以下以jQuery中的$.Deferred对象为例，来看一下promise对象是如何处理异步问题。关于$.Deferred对象，可以到jQuery官网查看，这里就不赘述了。
一、封装异步操作
首先，我们以加载图片为例，看以下代码：
以上的代码，我封装了图片加载的操作，将他们委托给$.Deferred，最后生成一个promise返回。使用这样的方式，相比用对外暴露回调的方式，显得更干净、更清晰。这么做的另一个更重要的原因是，promise的连接。
二、promise的连接
我们还是以上面图片加载的代码为例，来看一下如何做promise的连接，看以下代码：
promise对象提供了then的方法，它接受两个回调：onResolve和onReject，在回调中返回promise，就可以完成promise之间的连接。通过这种方式，可以使异步操作串行的执行。
同时，jQuery还提供了另外一种连接方式，看代码：
jQuery中提供了$.when这个函数，它可以接受n个promise对象为参数，它是将promise的执行结果连接在一起。使用这种方式，多个异步操作可以并行执行。
三、The End
这里的代码是以加载图片为例，同样的做法可以应用到其他的异步操作中去。比如jQuery中的$.ajax、$.fn.animate，调用它们返回的就是promise。在node端，也可以把一些异步操作（读数据库、读文件等）封装成promise。继而对多个promise实现合并的操作，使其串行或者并行执行。
附：deferred对象
deferred除了用于转化promise对象外，本身也是个很有用的对象。它除了提供像promise对象的那些方法和属性外，还有notify函数和progress函数，这两个函数在实现进度条和瀑布流的时候，有很大的用处。
在实现进度条时，resolve和done函数可以用于定义进度条读取到%时的触发时机和触发逻辑，notify和progress函数可以用于定义进度条在读取中的触发时机和触发逻辑。reject和fail函数可以用于定义进度读取失败时的触发时机和触发逻辑。
在实现瀑布流时，resolve和done函数可以用于定义当数据已经全部加载到页面的触发时机和触发逻辑，notify和progress函数可以用于定义瀑布流读取下一页的触发时机和触发逻辑。
jquery动画效果学习笔记（8种效果） 1、元素的显示和隐藏display:none;隐藏display:block;显示简单显示和隐藏方法a)show()显示b)hide()隐藏c)toggle()开关，显示则隐藏，隐藏则显示scripttype="text/javascrip
jquery实现九宫格大转盘抽奖 下面我们来分享一个九宫格抽奖特效特效说明：一款jQuery九宫格大转盘抽奖代码网页特效，点击抽奖按钮开始随机抽奖选择奖品，可设置起点位置、奖
WEB前端开发都应知道的jquery小技巧及jquery三个简写 一个简单技巧的集合，帮你提升jQuery技能。目前小编给大家整理了个jquery小技巧。目录结构1回到顶部按钮2预加载图片3检查图片是否加载完毕4自动修
标签: jquery的deferred
本文链接地址:https://www.jiuchutong.com/biancheng/370504.html 转载请保留说明！上一篇：Jquery promise实现一张一张加载图片(jquery prototype)
下一篇：jquery动画效果学习笔记（8种效果）(jquery动画库)
