jquery09--Callbacks : 回调对象

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="jquery-2.0.3.js"></script>
<script>
//Callbacks管理回调。-------------------------------------------------------
function aaa(){
    alert(1);
}
function bbb(){
    alert(2);
}
function ccc(){
    alert(3);
}
var cb = $.Callbacks();
cb.add( aaa );
cb.add( bbb );
cb.add( ccc );
cb.fire();

//绑定事件，观察者模式
document.addEventListener(‘click‘,function(){ alert(1); },false);
document.addEventListener(‘click‘,function(){ alert(2); },false);
document.addEventListener(‘click‘,function(){ alert(3); },false);
---------------------------------------------------------------------------

function aaa(){
    alert(1);
}
(function(){
    function bbb(){//局部作用域
        alert(2);
    }
})();
aaa();
bbb();
---------------------------------------------------------------------------
var cb = $.Callbacks();
function aaa(){
    alert(1);
}
cb.add(aaa);
(function(){
    function bbb(){
        alert(2);
    }
    cb.add(bbb);
})();
cb.fire();//1  2

----------------------------------------------------------------------
once
memory
unique
stopOnFalse

add
remove
has
empty
disable
disabled
lock
locked
fireWith
fire
fired
-------------------------------------------------------------------------

function aaa(){
    alert(1);
}
function bbb(){
    alert(2);
}
function ccc(){
    alert(3);
}
var cb = $.Callbacks();
cb.add( aaa );
cb.add( bbb );
cb.add( ccc );
cb.remove( bbb );
cb.fire();
</script>
</head>

<body>
</body>
</html>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="jquery-2.0.3.js"></script>
<script>

function aaa(){
    alert(1);
}

function bbb(){
    alert(2);
}

function ccc(){
    alert(3);
}
-------------------------------------------------------------------------
var cb = $.Callbacks(‘once‘);

cb.add( aaa );
cb.add( bbb );

cb.fire();
cb.fire();//触发一次
-------------------------------------------------------------------------
var cb = $.Callbacks(‘memory‘);

cb.add( aaa );

cb.fire();

cb.add( bbb );//弹出来，不写memory不谈
--------------------------------------------------------------------------
var cb = $.Callbacks(‘unique‘);

cb.add( aaa );
cb.add( aaa );

cb.fire();//只执行一次
---------------------------------------------------------------------------
function aaa1(){
    return false;
    alert(1);
}    

var cb = $.Callbacks(‘stopOnFalse‘);

cb.add( aaa1 );
cb.add( bbb );

cb.fire();//只谈1不谈2
----------------------------------------------------------------------------
var cb = $.Callbacks(‘once memory‘);//组合形式

cb.add( aaa );

cb.fire();//2也弹出来

cb.add( bbb );

cb.has (bbb );//true
cb.fire();//不执行
------------------------------------------------------------
options : { once : true , memory : true }

optionsCache : {
    ‘once memory‘ : { once : true , memory : true }
}
----------------------------------------------------------
function aaa(n){
    alert(‘aaa‘ + n);
    return false;
}
function bbb(n){
    alert(‘bbb‘+n);
}
var cb = $.Callbacks();
cb.add(aaa,bbb);
cb.fire(‘hello‘);
cb.fire(‘hello‘);
</script>
</head>

<body>
</body>
</html>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="jquery-2.0.3.js"></script>
<script>
---------------------------------------------------------------------
var bBtn = true;
function aaa(){
    alert(1);
    if(bBtn){
        cb.fire();
        bBtn = false;
    }
}
function bbb(){
    alert(2);
}
var cb = $.Callbacks();
cb.add( aaa );
cb.add( bbb );
cb.fire();
----------------------------------------------------------------------
function aaa(){
    alert(1);
}

function bbb(){
    alert(2);
}

var cb = $.Callbacks(‘once memory‘);

cb.add( aaa );

cb.fire();

cb.add( bbb );

cb.fire();

---------------------------------------------------------------------------
function aaa(){
    alert(1);
}

function bbb(){
    alert(2);
}

var cb = $.Callbacks(‘memory‘);

cb.add( aaa );

cb.fire();

cb.lock();

cb.add( bbb );

cb.fire();

</script>
</head>

<body>
</body>
</html>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="jquery-2.0.3.js"></script>
<script>

/*jQuery.extend({

    Deferred : function(){},
    when : function(){}

});

$.Deferred();   ->   $.Callbacks();
$.when();*/

/*var cb = $.Callbacks();

setTimeout(function(){

    alert(111);
    cb.fire();

},1000);

cb.add(function(){
    alert(222);
});

var dfd = $.Deferred();

setTimeout(function(){

    alert(111);
    dfd.resolve();

},1000);

dfd.done(function(){
    alert(222);
});

setTimeout(function(){

    alert(111);

},1000);

alert(222);*/

/*var dfd = $.Deferred();

setTimeout(function(){

    alert(111);
    dfd.notify();

},1000);

dfd.progress(function(){
    alert(222);
});*/

/*$.ajax({
    url : ‘xxx.php‘,
    success : function(){
        alert(‘成功‘);
    },
    error : function(){
        alert(‘失败‘);
    }
});*/

//$.ajax(‘xxx.php‘).done(function(){ alert(‘成功‘); }).fail(function(){ alert(‘失败‘); });

/*var dfd = $.Deferred();

setTimeout(function(){

    //alert(111);
    //dfd.resolve();
    dfd.reject();

},1000);

dfd.done(function(){
    alert(‘成功‘);
}).fail(function(){
    alert(‘失败‘);
});*/

/*var dfd = $.Deferred();

setInterval(function(){

    alert(111);
    //dfd.resolve();
    //dfd.reject();
    dfd.notify();

},1000);

dfd.done(function(){
    alert(‘成功‘);
}).fail(function(){
    alert(‘失败‘);
}).progress(function(){
    alert(‘进度中‘);
});*/

/*$(function(){

    var cb = $.Callbacks(‘memory‘);

    cb.add(function(){
        alert(1);
    });

    cb.fire();

    $(‘input‘).click(function(){

        cb.add(function(){
            alert(2);
        });

    });*/

/*    var dfd = $.Deferred();

    setTimeout(function(){

        alert(111);
        dfd.resolve();

    },1000);

    dfd.done(function(){
        alert(‘aaa‘);
    });

    $(‘input‘).click(function(){

        dfd.done(function(){
            alert(‘bbb‘);
        });

    });

});

done
fail
progress

resolve
reject
notify*/

/*function aaa(){

    var dfd = $.Deferred();

    alert( dfd.state() );

    setTimeout(function(){

        dfd.resolve();

        alert( dfd.state() );

    },1000);

    return dfd.promise();

}

var newDfd = aaa();

newDfd.done(function(){
    alert(‘成功‘);
}).fail(function(){
    alert(‘失败‘);
});*/

//newDfd.reject();

//alert(i^1);

/*var dfd = $.Deferred();

setTimeout(function(){

    //dfd.resolve();
    dfd.reject(‘hi‘);

},1000);*/

/*dfd.always(function(){

    alert(‘hello‘);

});*/

/*dfd.then(function(){
    alert(1);
},function(){
    alert(arguments[0]);
},function(){
    alert(3);
});*/

var dfd = $.Deferred();

setTimeout(function(){

    dfd.resolve(‘hi‘);

},1000);

var newDfd = dfd.pipe(function(){

    return arguments[0] + ‘妙味‘;

});

newDfd.done(function(){
    alert( arguments[0] );
});
</script>
</head>

<body>
<input type="button" value="点击">
</body>
</html>

时间： 2024-10-16 15:15:29

jquery09--Callbacks : 回调对象的相关文章

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

// optionsCache : { 'once memory' : { once : true , memory : true } } var optionsCache = {}; // once memory,options.match( core_rnotwhite )=[once, memory],function( _, flag )={once:true,memory:true} function createOptions( options ) { var object = op

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

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

jQuery中的$.Callbacks回调

前言在js中使用回调函数是很常见的.但是当触发一个事件时需要同时执行多个回调函数时,我们可能就需要一个队列来把这些回调函数存放起来,当事件触发时按照队列的先进先出原则依次调用这些回调函数.在jQuery中就是使用$.Callbacks这个工具方法来管理回掉函数队列的. 1 function fn1(){ 2 console.log(1); 3 } 4 function fn2(){ 5 console.log(2); 6 } 7 var callbacks = $.Callbacks(); 8

jQuery的异步回调对象Deffered分析

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

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

WCF初探-13：WCF客户端为双工服务创建回调对象

前言: 在WCF初探-5:WCF消息交换模式之双工通讯(Duplex)博文中,我讲解了双工通信服务的一个应用场景,即订阅和发布模式,这一篇,我将通过一个消息发送的例子讲解一下WCF客户端如何为双工服务创建回调对象. 双工服务指定一个回调协定,客户端应用程序必须实现该协定以便提供一个该服务能够根据协定要求调用的回调对象.虽然回调对象不是完整的服务(例如,您无法使用回调对象启动一个通道),但是为了实现和配置,这些回调对象可以被视为一种服务. 双工服务的客户端必须: 实现一个回调协定类. 创建回调协定

转载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的回调对象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分析

Callbacks在jQuery中的地位是Deferred的基础,当然,也对外公开其方法. Callbacks对象是统一管理多个函数的利器.其核心是参数options中的几个状态码的任意组合,非常灵活. 先来看看options once: 只触发一次回调 memory: 如果是触发后状态,add后立即触发 unique: 添加相同回到函数,只触发其中一个 stopOnFalse: 回调中遇到return false, 后面都不执行. 首先是: list = [] 我们的工作就是在维护这个list

jQuery之回调对象

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