//对外接口
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() : 队列方法 : 执行顺序的管理的更多相关文章

  1. jQuery源码分析系列(39) : 动画队列

    data函数在jQuery中只有短短的300行代码,非常不起点 ,剖析源码的时候你会发现jQuery只要在有需要保存数据的地方无时无刻不依赖这个基础设施 动画会调用队列,队列会调用data数据接口还保 ...

  2. Jquery源码分析之匿名函数的自执行

    匿名函数的格式: 格式: (function(){ //代码 })(); //和这个基于jQuery的比较下: $(function(){ alert("this is a test&quo ...

  3. jquery源码01---(2880 , 3042) Callbacks : 回调对象 : 对函数的统一管理

    // optionsCache : { 'once memory' : { once : true , memory : true } } var optionsCache = {}; // once ...

  4. jQuery源码解析资源便签

    最近开始解读jQuery源码,下面的链接都是搜过来的,当然妙味课堂 有相关的一系列视频,长达100多期,就像一只蜗牛慢慢爬, 至少品读三个框架,以后可以打打怪,自己造造轮子. 完全理解jQuery源代 ...

  5. jQuery源码逐行分析学习01(jQuery的框架结构简化)

    最近在学习jQuery源码,在此,特别做一个分享,把所涉及的内容都记录下来,其中有不妥之处还望大家指出,我会及时改正.望各位大神不吝赐教!同时,这也是我的第一篇前端技术博客,对博客编写还不是很熟悉,美 ...

  6. jQuery源码逐行分析学习02(第一部分:jQuery的一些变量和函数)

    第一次尝试使用Office Word,方便程度大大超过网页在线编辑,不过初次使用,一些内容不甚熟悉,望各位大神见谅~ 在上次的文章中,把整个jQuery的结构进行了梳理,得到了整个jQuery的简化结 ...

  7. jQuery源码笔记(一):jQuery的整体结构

    jQuery 是一个非常优秀的 JS 库,与 Prototype,YUI,Mootools 等众多的 Js 类库相比,它剑走偏锋,从 web 开发的实用角度出发,抛除了其它 Lib 中一些中看但不实用 ...

  8. jquery源码分析(二)——架构设计

    要学习一个库首先的理清它整体架构: 1.jQuery源码大致架构如下:(基于 jQuery 1.11 版本,共计8829行源码)(21,94)                定义了一些变量和函数jQu ...

  9. jQuery源码分析笔记

    jquery-2.0.3.js版本源码分析 (function(){  (21,94) 定义了一些变量和函数 jQuery = function(){};  (96,283) 给JQ对象,添加一些方法 ...

随机推荐

  1. 1.C语言指针学习之外挂篇

    学习了c语言的指针,那么指针能做什么呢,首先,他可以写外挂 首先我们来编写一个dll,挂载到植物大战僵尸上,记住是dll,因为如果你创建一个应用程序,该应用程序是不能操作其他程序的地址的. 第一步,打 ...

  2. SharePoint InfoPath 保存无法发布问题

    设计完表单以后提示以下错误 错误描述 InfoPath无法保存下列表单:******* 此文档库已被重命名或删除,或者网络问题导致文件无法保存.如果此问题持续存在,请于网络管理员联系. 可参考网站 & ...

  3. Objective-C 小记(10)__weak

    本文使用的 runtime 版本为 objc4-706. __weak 修饰的指针最重要的特性是其指向的对象销毁后,会自动置为 nil,这个特性的实现完全是依靠运行时的.实现思路是非常简单的,对于下面 ...

  4. Example of working with a dump.

    Let's say that you are looking at a crash dump, so following the first command from this page you do ...

  5. vue-cli生成的模板各个文件详解(转)

    vue-cli脚手架中webpack配置基础文件详解 一.前言 原文:https://segmentfault.com/a/1190000014804826 vue-cli是构建vue单页应用的脚手架 ...

  6. opencv——均值/中值滤波器去噪

    实验内容及实验原理: 1.用均值滤波器(即邻域平均法)去除图像中的噪声: 2.用中值滤波器去除图像中的噪声 3.比较两种方法的处理结果 实验步骤: 用原始图像lena.bmp或cameraman.bm ...

  7. Laravel核心解读--HTTP内核

    Http Kernel Http Kernel是Laravel中用来串联框架的各个核心组件来网络请求的,简单的说只要是通过public/index.php来启动框架的都会用到Http Kernel,而 ...

  8. GenIcam标准(五)

    2.8.10.Enumeration, EnumEntry Enumeration节点把一个名称(name)映射到一个索引值(index value),并实现Ienumeration接口.Enumer ...

  9. Android中图片优化之webp使用

    博客出自:http://blog.csdn.net/liuxian13183,转载注明出处! All Rights Reserved ! 有关图片的优化,通常我们会用到LruCache(使用强引用.强 ...

  10. vue29-vue2.0组件通信_recv

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...