time 
设为首页】【收藏本站

白小姐玄机图56: 白小姐彩图

当前位置: 白小姐彩图 > JavaScript > Jquery > jQuery回调、递延对象总结(二)then方法详解

jQuery回调、递延对象总结(二)then方法详解

时间:2014-01-07 21:16 点击:6285次 字体:[ ]




白小姐彩图 www.5vq5o.cn 前言:

什么叫做递延对象,生成一个递延对象只需调用jQuery.Deferred函数,deferred这个单词译为延期,推迟,即延迟的意思,那么在jQuery中

又是如何表达延迟的呢,从递延对象中的then方法或许能找到这种延迟的行为,本文重点解读递延对象中的then方法

 

设计思路:

在递延对象构造中,分别有三组回调对象,每一组回调对象都有与之对应的行为(action,add listener),和状态(final state),

这些行为都归纳为递延对象中的(触发回调,添加函数到回调列表中等)方法

 

jQuery.Deferred构造源码

Deferred构造源码除了then函数源码外,其他都非常简单,这里不做过多解读,后面将重点讨论then方法
 

  1. jQuery.extend({  
  2.  
  3.     Deferred: function( func ) {  
  4.         var tuples = [  
  5.                 // action, add listener, listener list, final state  
  6.                 [ "resolve""done", jQuery.Callbacks("once memory"), "resolved" ],  
  7.                 [ "reject""fail", jQuery.Callbacks("once memory"), "rejected" ],  
  8.                 [ "notify""progress", jQuery.Callbacks("memory") ]  
  9.             ],  
  10.             state = "pending",  
  11.             promise = {  
  12.                 state: function() {  
  13.                     return state;  
  14.                 },  
  15.                 always: function() {  
  16.                     deferred.done( arguments ).fail( arguments );  
  17.                     return this;  
  18.                 },  
  19.                 then: function/* fnDone, fnFail, fnProgress */ ) {  
  20.                     var fns = arguments;  
  21.                     return jQuery.Deferred(function( newDefer ) {  
  22.                         jQuery.each( tuples, function( i, tuple ) {  
  23.                             var action = tuple[ 0 ],  
  24.                                 fn = jQuery.isFunction( fns[ i ] ) && fns[ i ];  
  25.                             // deferred[ done | fail | progress ] for forwarding actions to newDefer  
  26.                             deferred[ tuple[1] ](function() {  
  27.                                 var returned = fn && fn.apply( this, arguments );  
  28.                                 if ( returned && jQuery.isFunction( returned.promise ) ) {  
  29.                                     returned.promise()  
  30.                                         .done( newDefer.resolve )  
  31.                                         .fail( newDefer.reject )  
  32.                                         .progress( newDefer.notify );  
  33.                                 } else {  
  34.                                     newDefer[ action + "With" ]( this === promise ? newDefer.promise() : this, fn ? [ returned ] : arguments );  
  35.                                 }  
  36.                             });  
  37.                         });  
  38.                         fns = null;  
  39.                     }).promise();  
  40.                 },  
  41.                 // Get a promise for this deferred  
  42.                 // If obj is provided, the promise aspect is added to the object  
  43.                 promise: function( obj ) {  
  44.                     return obj != null ? jQuery.extend( obj, promise ) : promise;  
  45.                 }  
  46.             },  
  47.             deferred = {};  
  48.  
  49.         // Keep pipe for back-compat  
  50.         promise.pipe = promise.then;  
  51.  
  52.         // Add list-specific methods  
  53.         jQuery.each( tuples, function( i, tuple ) {  
  54.             var list = tuple[ 2 ],  
  55.                 stateString = tuple[ 3 ];  
  56.  
  57.             // promise[ done | fail | progress ] = list.add  
  58.             promise[ tuple[1] ] = list.add;  
  59.  
  60.             // Handle state  
  61.             if ( stateString ) {  
  62.                 list.add(function() {  
  63.                     // state = [ resolved | rejected ]  
  64.                     state = stateString;  
  65.  
  66.                 // [ reject_list | resolve_list ].disable; progress_list.lock  
  67.                 // 可以看看上篇中lock方法的各种场景调用  
  68.                 }, tuples[ i ^ 1 ][ 2 ].disable, tuples[ 2 ][ 2 ].lock );  
  69.             }  
  70.  
  71.             // deferred[ resolve | reject | notify ]  
  72.             deferred[ tuple[0] ] = function() {  
  73.                 // 如果方法不被借用,那么回调中的this对象为promise,没有触发回调的方法  
  74.                 deferred[ tuple[0] + "With" ]( this === deferred ? promise : this, arguments );  
  75.                 return this;  
  76.             };  
  77.             deferred[ tuple[0] + "With" ] = list.fireWith;  
  78.         });  
  79.  
  80.         // Make the deferred a promise  
  81.         promise.promise( deferred );  
  82.  
  83.         // Call given func if any  
  84.         // 作用于then方法  
  85.         if ( func ) {  
  86.             func.call( deferred, deferred );  
  87.         }  
  88.  
  89.         // All done!  
  90.         return deferred;  
  91.     }  
  92. }); 

 



本文地址 : //www.5vq5o.cn/plus/view-214465-1.html
标签: jquery 回调 递延对象 then方法
------分隔线----------------------------
最新评论 查看所有评论
发表评论 查看所有评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:

  • 您要明白的是,如果按照上海市的人口基数2500万计算的话,就算有100万的服务人员,平均每人也要保障25个人的预约服务.人要理性 2019-04-06
  • 回复@海之宁:你的卡点就在于不知道分配既涉及消费资料有涉及生产资料。 2019-04-06
  • 赵雅芝联合“我·爱我 女性健康工程”为乳腺健康共发声 2019-04-03
  • 合肥市庐阳中学启动“教师成长工程” 2019-04-01
  • 中年不发福!51岁景岗山紧身衣秀健硕身材 2019-04-01
  • 炒房炒房,炒了北京炒西安,炒了天堂炒人间,何时休?限价现价叫人害怕。 2019-03-27
  • “5·15”全国公安机关打击和防范经济犯罪宣传日 2019-03-27
  • 穿拖鞋开车酿成追尾事故 2019-03-20
  • 重庆市永川区:“1+8+X”模式探索基层人民调解新路子 2019-03-20
  • 巢湖市第三届少儿器乐比赛圆满落幕 2019-02-15
  • Valentino 2017秋冬高级定制大秀 2018-09-08
  • 中国经济充当了世界经济发展的火车头。但是,作为世界经济火车头的中国,在世界主要经济体股市都走牛的情况下,为何熊途漫漫?这种不正常的现象,背后是我们资本市场的投融 2018-07-14
  • 别空谈,说说看,这个“简单的逻辑关系”是什么关系? 2018-07-13
  • “讲课带着泥土味,我们都爱听” 2018-07-13
  • 习近平:绿水青山就是金山银山 2018-07-12
  • 256| 377| 40| 145| 967| 14| 281| 689| 639| 280|