美文网首页
6.1$.Callbacks()

6.1$.Callbacks()

作者: zwj2024 | 来源:发表于2017-12-14 21:54 被阅读11次

6.1基本使用
1.一系列函数已经按照顺序执行完

function aaa(){
    alert(1);
}
function bbb(){
    alert(2);
}
var cb = $.Callbacks();
//把函数添加到这个回调对象里面
cb.add( aaa );
cb.add( bbb );
cb.fire();//可以触发添加到回调对象里面对方法。

有点类似于js中绑定事件,如
document.addEventListener('click',function(){ alert(1); },false);
document.addEventListener('click',function(){ alert(2); },false);
document.addEventListener('click',function(){ alert(3); },false);
只要一点击页面就会触发这三个页面。

这种就是观察者模式。


源码设计原理

先收集,然后一个统一出发

2.让不同作用域下函数进行统一管理

function aaa(){
    alert(1);
}
(function(){//一个自执行对匿名函数    
    function bbb(){
        alert(2);
    }   
})();
aaa();
bbb(); //发现只有aaa函数执行了。

利用回调函数之后:

var cb = $.Callbacks();
function aaa(){
    alert(1);
}
cb.add(aaa);
(function(){    
    function bbb(){
        alert(2);
    }
    cb.add(bbb);    
})();
cb.fire();

6.2流程图及其配置参数

配置参数
once:因为类似事件绑定,可以多次触发,这个参数表示只触发一次。var cb = $.Callbacks('once');cb.fire(); cb.fire();

memory:var cb = $.Callbacks();cb.add( aaa );cb.fire();cb.add( bbb );那么只会执行aaa函数。var cb = $.Callbacks('memory');cb.add( aaa );cb.fire();cb.add( bbb );那么都可以触发。memory不按先后顺序了,会把add添加函数都执行。

unique:不能重复执行同一个函数var cb = $.Callbacks();cb.add( aaa );cb.add( aaa );cb.fire();会发现aaa重复执行2次。var cb = $.Callbacks('unique');cb.add( aaa );cb.add( aaa );cb.fire();

stopOnFalse:所添加的函数返回值是false,那么后续添加的函数是不会执行的,即当一个函数返回false 时中断调用。function aaa(){alert(1);return false;} function bbb(){alert(2);}function ccc(){alert(3);} var cb = $.Callbacks(); cb.add( aaa ); cb.add( bbb ); cb.add( ccc ); cb.fire();都会执行,当添加var cb = $.Callbacks('stopOnFalse');那么后面就不会再执行了。

也可以组合写法如var cb = $.Callbacks('once memory');

流程图

image.png image.png image.png image.png image.png

jQuery.Callbacks 中文文档

jQuery 2.0.3 源码分析 回调对象 - Callbacks

相关文章

网友评论

      本文标题:6.1$.Callbacks()

      本文链接:https://www.haomeiwen.com/subject/hurnixtx.html