jQuery源码05 (3653 , 3797) queue() : 队列方法 : 执行顺序的管理
//对外接口
jQuery.extend({
queue: function( elem, type, data ) {//入队。元素、队列名字、存进去的函数
//jQuery.queue( this, type, function( next, hooks ) {})
var queue; if ( elem ) {
type = ( type || "fx" ) + "queue";//不写队列名字就是fx
// $.queue( document , 'q1' , aaa||[aaa,bbb] );
queue = data_priv.get( elem, type );//get方法var cache = this.cache[ this.key( elem ) ];return type === undefined ? cache : cache[ type ];key方法return unlock = elem[ this.expando ];根据元素的唯一标识expando获取在data_priv对象中缓存中的1,2,3,4这个unlock数字,根据unlock这个数字获取cache中的json,根据type获取json中的值
/*
data_priv = {
1(document.203089541586732714850=1):{
name(type):'哈哈'(queue),
q1queue(type):...(queue数组),
}
}
*/ // Speed up dequeue by getting out quickly if this is just a lookup
if ( data ) {//函数名
if ( !queue || jQuery.isArray( data ) ) {//queue没有(函数是不是数组)或者queue有但是函数是数组,注意是数组就会把之前的全部覆盖。
/*
$.queue( document , 'q1' , aaa );
$.queue( document , 'q1' , bbb );
$.queue( document , 'q1' , [ccc] );
*/
queue = data_priv.access( elem, type, jQuery.makeArray(data) );
} else {//queue有(说明q1队列之前加过)并且函数不是数组直接push,注意queue没有的时候queue始终存的是一个数组
queue.push( data );
}
}
return queue || [];
}
}, dequeue: function( elem, type ) {
type = type || "fx";
//只能写jQuery.queue(),不能写queue(),queue()是jQuery类的静态方法,只能通过静态方式调用。
/*
jQuery.extend( {a:function(){alert(1)},b:function(){jQuery.a();}} )
$.b();
*/
var queue = jQuery.queue( elem, type ),//得到type对应的值,是一个数组,
startLength = queue.length,
fn = queue.shift(),//去除数组第一个
hooks = jQuery._queueHooks( elem, type ),
next = function() {
jQuery.dequeue( elem, type );//下一个,不能直接写dequeue,这行语句还没执行完时dequeue是不存在的
}; // If the fx queue is dequeued, always remove the progress sentinel
if ( fn === "inprogress" ) {
fn = queue.shift();
startLength--;
} if ( fn ) { // Add a progress sentinel to prevent the fx queue from being
// automatically dequeued
if ( type === "fx" ) {
queue.unshift( "inprogress" );//inprogress添进去
} // clear up the last queue stop function
delete hooks.stop;
fn.call( elem, next, hooks );//出队的函数执行,
} if ( !startLength && hooks ) {
hooks.empty.fire();
}
}, /*
data_priv = {
1(elem:document.203089541586732714850=1):{
name(type):'哈哈'(queue),
q1queue(type):...(queue数组),
}
}
*/
_queueHooks: function( elem, type ) {
var key = type + "queueHooks";
//有就获取,没有key,value都存在value是json就追加
return data_priv.get( elem, key ) || data_priv.access( elem, key, {
empty: jQuery.Callbacks("once memory").add(function() {
data_priv.remove( elem, [ type + "queue", key ] );
})
});
}
}); jQuery.fn.extend({
//this.queue( type, function( next, hooks ) {
//$('#div').queue('q1',bbb);
queue: function( type, data ) {
var setter = 2;
//$('#div').queue(bbb);
if ( typeof type !== "string" ) {//只传了一个函数,没有type
data = type;
type = "fx";
setter--;
}
///console.log( $('#div').queue('q1') ); 查看
if ( arguments.length < setter ) {
return jQuery.queue( this[0], type );//静态方法调用
} return data === undefined ?
this :
this.each(function() {//$('#div')是一个数组,对每一个设置
var queue = jQuery.queue( this, type, data );//每一个入队 // ensure a hooks for this queue
jQuery._queueHooks( this, type ); if ( type === "fx" && queue[0] !== "inprogress" ) {
jQuery.dequeue( this, type );//第一个入队然后立即出队,调用
}
});
},
dequeue: function( type ) {
return this.each(function() {
jQuery.dequeue( this, type );//每一个出队
});
}, //.delay(2000)
/*
jQuery.fx.speeds = {
slow: 600,
fast: 200,
// Default speed
_default: 400
};
*/
//jQuery.fx = Tween.prototype.init;
delay: function( time, type ) {
time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time;
type = type || "fx";
//queue第二个参数是匿名函数,也添加进去
return this.queue( type, function( next, hooks ) {
var timeout = setTimeout( next, time );
hooks.stop = function() {
clearTimeout( timeout );
};
});
},
clearQueue: function( type ) {
return this.queue( type || "fx", [] );//空数组是真
},
//队列全部执行完之后,再去调用
promise: function( type, obj ) {
var tmp,
count = 1,
defer = jQuery.Deferred(),
elements = this,
i = this.length,
resolve = function() {
if ( !( --count ) ) {
defer.resolveWith( elements, [ elements ] );
}
}; if ( typeof type !== "string" ) {
obj = type;
type = undefined;
}
type = type || "fx"; while( i-- ) {
tmp = data_priv.get( elements[ i ], type + "queueHooks" );
if ( tmp && tmp.empty ) {
count++;
tmp.empty.add( resolve );
}
}
resolve();
return defer.promise( obj );
}
});
jQuery源码05 (3653 , 3797) queue() : 队列方法 : 执行顺序的管理的更多相关文章
- jQuery源码分析系列(39) : 动画队列
data函数在jQuery中只有短短的300行代码,非常不起点 ,剖析源码的时候你会发现jQuery只要在有需要保存数据的地方无时无刻不依赖这个基础设施 动画会调用队列,队列会调用data数据接口还保 ...
- Jquery源码分析之匿名函数的自执行
匿名函数的格式: 格式: (function(){ //代码 })(); //和这个基于jQuery的比较下: $(function(){ alert("this is a test&quo ...
- jquery源码01---(2880 , 3042) Callbacks : 回调对象 : 对函数的统一管理
// optionsCache : { 'once memory' : { once : true , memory : true } } var optionsCache = {}; // once ...
- jQuery源码解析资源便签
最近开始解读jQuery源码,下面的链接都是搜过来的,当然妙味课堂 有相关的一系列视频,长达100多期,就像一只蜗牛慢慢爬, 至少品读三个框架,以后可以打打怪,自己造造轮子. 完全理解jQuery源代 ...
- jQuery源码逐行分析学习01(jQuery的框架结构简化)
最近在学习jQuery源码,在此,特别做一个分享,把所涉及的内容都记录下来,其中有不妥之处还望大家指出,我会及时改正.望各位大神不吝赐教!同时,这也是我的第一篇前端技术博客,对博客编写还不是很熟悉,美 ...
- jQuery源码逐行分析学习02(第一部分:jQuery的一些变量和函数)
第一次尝试使用Office Word,方便程度大大超过网页在线编辑,不过初次使用,一些内容不甚熟悉,望各位大神见谅~ 在上次的文章中,把整个jQuery的结构进行了梳理,得到了整个jQuery的简化结 ...
- jQuery源码笔记(一):jQuery的整体结构
jQuery 是一个非常优秀的 JS 库,与 Prototype,YUI,Mootools 等众多的 Js 类库相比,它剑走偏锋,从 web 开发的实用角度出发,抛除了其它 Lib 中一些中看但不实用 ...
- jquery源码分析(二)——架构设计
要学习一个库首先的理清它整体架构: 1.jQuery源码大致架构如下:(基于 jQuery 1.11 版本,共计8829行源码)(21,94) 定义了一些变量和函数jQu ...
- jQuery源码分析笔记
jquery-2.0.3.js版本源码分析 (function(){ (21,94) 定义了一些变量和函数 jQuery = function(){}; (96,283) 给JQ对象,添加一些方法 ...
随机推荐
- luogu 3393 逃离僵尸岛
题目描述 小a住的国家被僵尸侵略了!小a打算逃离到该国唯一的国际空港逃出这个国家. 该国有N个城市,城市之间有道路相连.一共有M条双向道路.保证没有自环和重边. K个城市已经被僵尸控制了,如果贸然闯入 ...
- ubuntu16.04下snort的安装(官方文档安装)(图文详解)
不多说,直接上干货! 最近为了科研,需要安装和使用Snort. snort的官网 https://www.snort.org/ Snort作为一款优秀的开源主机入侵检测系统,在windows和Linu ...
- SQL SERVER中求上月、本月和下月的第一天和最后一天
1.上月的第一天 SELECT CONVERT(CHAR(10),DATEADD(month,-1,DATEADD(dd,-DAY(GETDATE())+1,GETDATE())),111) 2.上月 ...
- 那些不兼容 IE11的网站(持续更新)
此博文用于收集不兼容 IE11 的网站,持续更新,请网站开发者自己认领: 兼容性引起的功能缺陷: v.qq.com (提示未安装 Flash 播放器,这问题我反馈几百年了,还没修复) tv.sohu. ...
- 一些标签库的学习和do的讨论
JSTL 核心标签库http://www.cnblogs.com/lihuiyy/archive/2012/02/24/2366806.html .do的讨论http://bbs.csdn.net/t ...
- 安装vue时使用npm install 报错
npm ERR! Darwin 14.3.0 npm ERR! argv "/usr/local/Cellar/node/6.4.0/bin/node" "/usr/lo ...
- NOIP 2017 小凯的疑惑(同余类)
题意 给出两个互质的数a,b问最大的不能被xa+yb(x,y>=0)表示的数.(a,b<=109) 题解 NOIPday1T1一道数论题,不知埋葬了多少人的梦想. 用同余类去解释. 我们依 ...
- memset函数的用法
重点需要注意一个细节:memset是以byte来填充的,也就是一个字节(8bit)一个单位来填充. 因此:如果int array[10]: memset(array, 1, 10):然后再把array ...
- Perl模块利用CPAN在线安装自动化
需要解决2个问题: 1. 如何与CPAN交互:利用perl –MCPAN –e ‘install 模块’ 2. 如何安装指定的版本:作者/模块-版本.tar.gz How to install a ...
- eBay起诉指控亚马逊利用非法手段挖走其卖家
[摘要]eBay在诉状中称,亚马逊的代表滥用eBay的内部电子邮件系统联系卖家,这违反了市场政策. 腾讯科技讯 10月18日消息,据外媒报道,拍卖网站eBay对亚马逊提起诉讼,指控这家美国零售巨头利用 ...