jQuery中回调对象

关键词:回调对象

语法:
var call = $.Callbacks('once','memory','unique','stopOnFalse');

参数

  • 'once':只触发一次
  • 'memory':有记忆功能
  • 'unique':去除重发的添加
  • 'stopOnFalse':当函数return false时候不执行

方法

  • add();
  • remove();
  • fire(); 执行

例子:

    function fn1() {
        console.dir("f1")
    }
    function fn2() {
        console.dir("f2")
    }
    function fn3() {
        console.dir("f3")
    }

    var call = $.Callbacks('once','memory','unique','stopOnFalse');
    call.add(fn1);
    call.add(fn1);
    call.add(fn2);
    call.fire();  // 
    call.add(fn3);
    call.remove(fn1);
    call.fire();  // 

说完了使用方法,那有什么用呢?

    function a(){
        console.log(1);
    }
    (function(){
        function b(){
    console.log(2);     
    }
    call.add(b);    
    })()
    a();  //1
    b();  // not defined

和想象的一样,报错了,那怎么办呢,这是个匿名函数,又不能用闭包。
这时候我们可以用延迟对象了

 var call = $.Callbacks();
   (function(){
       function b(){
   console.log(2);     
   }
   call.add(b);    
   })()
   a();  //1
   // b();  // not defined
   call.fire();  //2

没错,就这么简单!

再来一个

  setTimeout(function(){
        console.log('setTimeout');
    },0)
  console.log('global');

setTimeout会在global之后打印出来,即使设为0s也无济于事,这是js的执行顺序决定的,那我们现在这样做:

  var call = $.Callbacks();

    setTimeout(function(){
        console.log('setTimeout');
        call.fire();
    },1000)
    
  call.add(function () {
    console.log('global'); 
  })

这样我们就可以按照自己想要的顺序执行了

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容