jQuery的回调对象Callbacks分析

Callbacks在jQuery中的地位是Deferred的基础,当然,也对外公开其方法。

Callbacks对象是统一管理多个函数的利器。其核心是参数options中的几个状态码的任意组合,非常灵活。

先来看看options

once: 只触发一次回调

memory: 如果是触发后状态,add后立即触发

unique: 添加相同回到函数,只触发其中一个

stopOnFalse: 回调中遇到return false, 后面都不执行。

首先是:

list = []

我们的工作就是在维护这个list

add: function() {
                if ( list ) {
                    // First, we save the current length
                    var start = list.length;
                    (function add( args ) {
                        jQuery.each( args, function( _, arg ) {
                            var type = jQuery.type( arg );
                            if ( type === "function" ) {
                                if ( !options.unique || !self.has( arg ) ) {
                                    list.push( arg );
                                }
                            } else if ( arg && arg.length && type !== "string" ) {
                                // Inspect recursively
                                add( arg );
                            }
                        });
                    })( arguments );
                    // Do we need to add the callbacks to the
                    // current firing batch?
                    if ( firing ) {
                        firingLength = list.length;
                    // With memory, if we‘re not firing then
                    // we should call right away
                    } else if ( memory ) {
                        firingStart = start;
                        fire( memory );
                    }
                }
                return this;
            },

其核心就是那个push方法。代码为什么这么多? 支持数组方式参数,遇到参数中有memory情况,执行方法。

remove方法:

remove: function() {
                if ( list ) {
                    jQuery.each( arguments, function( _, arg ) {
                        var index;
                        while( ( index = jQuery.inArray( arg, list, index ) ) > -1 ) {
                            list.splice( index, 1 );
                            // Handle firing indexes
                            if ( firing ) {
                                if ( index <= firingLength ) {
                                    firingLength--;
                                }
                                if ( index <= firingIndex ) {
                                    firingIndex--;
                                }
                            }
                        }
                    });
                }
                return this;
            },

其核心也是那个splice方法。

针对这个firing,后面介绍。

fire方法:

fire = function( data ) {
            memory = options.memory && data;
            fired = true;
            firingIndex = firingStart || 0;
            firingStart = 0;
            firingLength = list.length;
            firing = true;
            for ( ; list && firingIndex < firingLength; firingIndex++ ) {
                if ( list[ firingIndex ].apply( data[ 0 ], data[ 1 ] ) === false && options.stopOnFalse ) {
                    memory = false; // To prevent further calls using add
                    break;
                }
            }
            firing = false;
            if ( list ) {
                if ( stack ) {
                    if ( stack.length ) {
                        fire( stack.shift() );
                    }
                } else if ( memory ) {
                    list = [];
                } else {
                    self.disable();
                }
            }
        }

其核心是哪个循环,拿出来一个个执行。

在这里有个stack

stack = !options.once && []

这是一个数组,干嘛用的呢?这是针对有些函数是延时函数,这种情况fire可能会延时,要先把它放到stack函数中。

这样,以上的firing状态也就可以理解了。

这就是Callbacks整体,其核心原理还算是比较简单了。

时间: 2024-08-29 03:22:32

jQuery的回调对象Callbacks分析的相关文章

jquery的回调对象Callbacks详解

Callbacks : 对函数的统一管理 Callbacks的options参数接受4个属性,分别是once : 只执行一次momery : 记忆stopOnFalse : 强制退出循环unique : 唯一 暂时先不管4个属性有什么意思,我们看代码开始部分对options做了处理,如果options是字符串则调用createOptions方法转成json比如:var cb = $.Callbacks('once momery');转换为:{once:true,momery:true}这里就不贴

jquery源码分析(四)——回调对象 Callbacks

借用百度百科来说明下回调函数: 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数.回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应. jQuery回调对象实现恰好利用了设计模式中的观察者模式思想,观察者模式 (pub/sub) 的背后,总的想法是在应用程序中增强松耦合性.并非是在其它对象的方法上的单个对象调用.一个对象作为特定任务或

转载Aaron博客 ---- jQuery 2.0.3 源码分析 回调对象 - Callbacks

源码API:http://api.jquery.com/jQuery.Callbacks/ jQuery.Callbacks()是在版本1.7中新加入的.它是一个多用途的回调函数列表对象,提供了一种强大的方法来管理回调函数队列. 那么jQuery.Callbacks使用场景在哪里? 在很多时候需要控制一系列的函数顺序执行.那么一般就需要一个队列函数来处理这个问题 我们看一段代码 function Aaron(List, callback) { setTimeout(function() { va

jQuery的异步回调对象Deffered分析

先来思考一个问题:一个需要耗时很长的操作比如setTimeout, ajax请求等,我们需要在延时操作后执行一个函数done. 比如: var wait = function(){ var tasks = function(){ alert("执行完毕!"); }; setTimeout(tasks,5000); }; 在wait执行完毕后,再执行done或者fail函数. 怎么做?当然,你可以在tasks函数中执行done() 或者 fail() ,但是不够优雅的实现.如果加入异步队

jQuery之回调对象

1. jQuery 1.7 版本中新增的 jQuery.Callbacks() 函数返回一个全能的对象,此对象对管理回调列表提供了强大的方式.它能够增加.删除.触发.禁用回调函数. 2. callbacks.add()方法:回调列表中添加一个回调或回调集合.如下代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <s

jQuery源码笔记——回调对象

回调对象是一个多用途的回调列表对象,提供了强大的的方式来管理回调函数列表. 最简单的缓存对象 function Callbacks(){ var list = [], self = { add: function(fn){ list.push(fn); }, remove: function(fn){ var index; if((index = list.indexOf(fn)) > -1){ list.splice( index, 1 ); } }, fire: function(value

jQuery之ajax错误调试分析

jQuery之ajax错误调试分析 jQuery中把ajax封装得非常好.但是日常开发中,我偶尔还是会遇到ajax报错.这里简单分析一下ajax报错 一般的jQuery用法如下,ajax通过post方式提交"汤姆和老鼠"这段数据到xxx.php文件中.成功后则打印返回的数据,失败则打印错误原因. 1 2 3 4 5 6 7 8 9 10 $.ajax({     url:"xxx.php",     type:"post",     dataty

jQuery源码 Ajax模块分析

写在前面: 先讲讲ajax中的相关函数,然后结合函数功能来具体分析源代码. 相关函数: >>ajax全局事件处理程序 .ajaxStart(handler) 注册一个ajaxStart事件处理器.当一个Ajax请求开始,并且同时无其它未完成的Ajax请求时,jQuery触发ajaxStart事件. .ajaxSend(handler) 注册一个ajaxSend事件处理器.当一个Ajax请求被发送时触发ajaxSend事件. .ajaxSuccess(handler) 注册一个ajaxSucce

jQuery的回调支持

1.前言 jQuery提供了以下方法来创建Callbacks对象. jQuery.Callbacks(flags):根据创建的flags创建并返回Callsbacks对象,Callbacks对象代表一个回调函数列表. 得到回调函数列表之后,就接下来可以利用该回调函数列表来管理回调函数了. 2.例子 <!DOCTYPE html> <html> <head> <meta name="author" content="OwenWillia