最近大量的用到j(luò)Query Callbacks 對(duì)象，jQuery庫中的$.ajax()和$.Deferred() 對(duì)象也是基于這個(gè)對(duì)象實(shí)現(xiàn)，下面我們也模擬實(shí)現(xiàn)jQuery Callbacks 對(duì)象的部分功能

用法和$.Callbacks完全一致 ， 但是只是實(shí)現(xiàn)了add , remove , fire , empty, has和帶參數(shù)的構(gòu)造函數(shù)功能，  $.Callbacks 還有disable,disabled, fireWith , fired , lock, locked 方法

代碼如下：


復(fù)制代碼 代碼如下:

String.prototype.trim = function ()
       {
           return this.replace( /^\s+|\s+$/g, '' );
       };

       // Simulate jQuery.Callbacks object
       function MyCallbacks( options )
       {
           var ops = { once: false, memory: false, unique: false, stopOnFalse: false };

           if ( typeof options === 'string' && options.trim() !== '' )
           {
               var opsArray = options.split( /\s+/ );
               for ( var i = 0; i < options.length; i++ )
               {
                   if ( opsArray[i] === 'once' )
                       ops.once = true;
                   else if ( opsArray[i] === 'memory' )
                       ops.memory = true;
                   else if ( opsArray[i] === 'unique' )
                       ops.unique = true;
                   else if ( opsArray[i] === 'stopOnFalse' )
                       ops.stopOnFalse = true;
               }
           }

           var ar = [];
           var lastArgs = null;
           var firedTimes = 0;

           function hasName( name )
           {
               var h = false;

               if ( typeof name === 'string'
                   && name !== null
                   && name.trim() !== ''
                   && ar.length > 0 )
               {
                   for ( var i = 0; i < ar.length; i++ )
                   {
                       if ( ar[i].name === name )
                       {
                           h = true;
                           break;
                       }
                   }
               }

               return h;
           }

           // add a function
           this.add = function ( fn )
           {
               if ( typeof fn === 'function' )
               {
                   if ( ops.unique )
                   {
                       // check whether it had been added before
                       if ( fn.name !== '' && hasName( fn.name ) )
                       {
                           return this;
                       }
                   }

                   ar.push( fn );

                   if ( ops.memory )
                   {
                       // after added , call it immediately
                       fn.call( this, lastArgs );
                   }
               }

               return this;
           };

           // remove a function
           this.remove = function ( fn )
           {
               if ( typeof ( fn ) === 'function'
                   && fn.name !== ''
                   && ar.length > 0 )
               {
                   for ( var i = 0; i < ar.length; i++ )
                   {
                       if ( ar[i].name === fn.name )
                       {
                           ar.splice( i, 1 );
                       }
                   }
               }

               return this;
           };

           // remove all functions
           this.empty = function ()
           {
               ar.length = 0;
               return this;
           };

           // check whether it includes a specific function
           this.has = function ( fn )
           {
               var f = false;

               if ( typeof ( fn ) === 'function'
                   && fn.name !== ''
                   && ar.length > 0 )
               {
                   for ( var i = 0; i < ar.length; i++ )
                   {
                       if ( ar[i].name === fn.name )
                       {
                           f = true;
                           break;
                       }
                   }
               }

               return f;
           };

           // invoke funtions it includes one by one
           this.fire = function ( args )
           {
               if ( ops.once && firedTimes > 0 )
               {
                   return this;
               }

               if ( ar.length > 0 )
               {
                   var r;

                   for ( var i = 0; i < ar.length; i++ )
                   {
                       r = ar[i].call( this, args );

                       if ( ops.stopOnFalse && r === false )
                       {
                           break;
                       }
                   }
               }

               firedTimes++;

               if ( ops.memory )
               {
                   lastArgs = args;
               }

               return this;
           };
       };


測試函數(shù)如下：（注意fn1 fn2是匿名函數(shù)， fn2返回false , fn3是有“名”函數(shù)）


復(fù)制代碼 代碼如下:

var fn1 = function ( v )
       {
           console.log( 'fn1 ' + ( v || '' ) );
       };

       var fn2 = function ( v )
       {
           console.log( 'fn2 ' + ( v || '' ) );
           return false;
       };

       function fn3( v )
       {
           console.log( 'fn3 ' + ( v || '' ) );
       };


1 . 測試add & fire

var cb=new MyCallbacks();

cb.add(fn1)

cb.add(fn2)

cb.add(fn3)

cb.fire('hello')

輸出：

fn1 hello
fn2 hello
fn3 hello

2.測試remove
var cb=new MyCallbacks();

cb.add(fn1)

cb.add(fn2)

cb.add(fn3)

cb.remove(fn1)
cb.fire('hello')
cb.remove(fn3)
cb.fire('hello')
輸出：

fn1 hello
fn2 hello
fn3 hello
----------------------------
fn1 hello
fn2 hello

2.測試has
var cb=new MyCallbacks();

cb.add(fn1)

cb.add(fn2)

cb.add(fn3)

cb.has(fn1)

cb.has(fn3)

輸出：

false

---------------

true

3.測試帶參數(shù)的構(gòu)造函數(shù) : once

var cb=new MyCallbacks('once')

cb.add(fn1)

cb.fire('hello')

cb.fire('hello')

cb.add(fn2)

cb.fire('hello')

輸出：

hello

-------------------

------------------

------------------------------

4.測試帶參數(shù)的構(gòu)造函數(shù) : memory

var cb=new MyCallbacks('memory')

cb.add(fn1)

cb.fire('hello') // 輸出 : fn1 hello

cb.add(fn2) // 輸出 : fn2 hello

cb.fire('hello')

輸出 :

fn1 hello

fn2 hello

5.測試帶參數(shù)的構(gòu)造函數(shù) : stopOnFalse

var cb=new MyCallbacks('stopOnFalse')

cb.add(fn1)

cb.add(fn2)

cb.add(fn3)

cb.fire('hello')

輸出：

fn1 hello
fn2 hello
6.測試帶參數(shù)的構(gòu)造函數(shù) :unique

var cb=new MyCallbacks('unique')



b.add(fn3)

b.add(fn3)

cb.fire('hello')

輸出：

fn3 hello



7. 測試帶組合參數(shù)的構(gòu)造函數(shù)：四個(gè)設(shè)置參數(shù)可以隨意組合，一下只測試全部組合的情況， 不然要寫16個(gè)測試用例 T_T

var cb=new MyCallbacks('once memory unique stopOnFalse')

cb.add(fn1) // 輸出： fn1

cb.add(fn2) // 輸出： fn2

cb.add(fn3) //  輸出： fn3

cb.fire('hello')

輸出：

fn1 hello
fn2 hello
cb.fire('hello') // 輸出：沒有輸出



以下是官方API 文檔：

Description: A multi-purpose callbacks list object that provides a powerful way to manage callback lists.The $.Callbacks() function is internally used to provide the base functionality behind the jQuery $.ajax() and$.Deferred() components. It can be used as a similar base to define functionality for new components.

構(gòu)造函數(shù) ： jQuery.Callbacks( flags )

flags
Type: String
An optional list of space-separated flags that change how the callback list behaves.
Possible flags:
once: Ensures the callback list can only be fired once (like a Deferred).
memory: Keeps track of previous values and will call any callback added after the list has been fired right away with the latest "memorized" values (like a Deferred).
unique: Ensures a callback can only be added once (so there are no duplicates in the list).
stopOnFalse: Interrupts callings when a callback returns false.
By default a callback list will act like an event callback list and can be "fired" multiple times.

Two specific methods were being used above: .add() and .fire(). The .add() method supports adding new callbacks to the callback list, while the .fire() method executes the added functions and provides a way to pass arguments to be processed by the callbacks in the same list.

利用Callbacks 實(shí)現(xiàn)發(fā)布訂閱模式 pub/sub: (官方文檔)

復(fù)制代碼 代碼如下:

var topics = {};

       jQuery.Topic = function ( id )
       {
           var callbacks,
               method,
               topic = id && topics[id];

           if ( !topic )
           {
               callbacks = jQuery.Callbacks();
               topic = {
                   publish: callbacks.fire,
                   subscribe: callbacks.add,
                   unsubscribe: callbacks.remove
               };
               if ( id )
               {
                   topics[id] = topic;
               }
           }
           return topic;
       };

使用

復(fù)制代碼 代碼如下:

$.Topic( 'mailArrived' ).subscribe( function ( e )
       {
           console.log( 'Your have new email! ' );
           console.log( "mail title : " + e.title );
           console.log( "mail content : " + e.content );
       }
       );

       $.Topic( 'mailArrived' ).publish( { title: 'mail title', content: 'mail content' } );


實(shí)現(xiàn)了其余的全部功能 ：callbacks.disable , callbacks.disabled,   callbacks.fired,callbacks.fireWith, callbacks.lock, callbacks.locked ,然后重構(gòu)了下代碼結(jié)構(gòu)， 將實(shí)現(xiàn)放入了匿名函數(shù)內(nèi)， 然后通過工廠方法 window.callbacks 返回實(shí)例，以免每次使用必須 new .

具體代碼如下， 有興趣和時(shí)間的可以對(duì)照jQuery版本的Callbacks對(duì)比下 ：
unity3d腳本http://www.unitymanual.com/

成都創(chuàng)新互聯(lián)憑借在網(wǎng)站建設(shè)、網(wǎng)站推廣領(lǐng)域領(lǐng)先的技術(shù)能力和多年的行業(yè)經(jīng)驗(yàn)，為客戶提供超值的營銷型網(wǎng)站建設(shè)服務(wù)，我們始終認(rèn)為：好的營銷型網(wǎng)站就是好的業(yè)務(wù)員。我們已成功為企業(yè)單位、個(gè)人等客戶提供了成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)服務(wù)，以良好的商業(yè)信譽(yù)，完善的服務(wù)及深厚的技術(shù)力量處于同行領(lǐng)先地位。

復(fù)制代碼 代碼如下:

( function ( window, undefined )
       {
           // Simulate jQuery.Callbacks object
           function Callbacks( options )
           {
               var ops = { once: false, memory: false, unique: false, stopOnFalse: false },
                   ar = [],
                   lastArgs = null,
                   firedTimes = 0,
                   _disabled = false,
                   _locked = false;

               if ( typeof options === 'string' && options.trim() !== '' )
               {
                   var opsArray = options.split( /\s+/ );
                   for ( var i = 0; i < options.length; i++ )
                   {
                       if ( opsArray[i] === 'once' )
                           ops.once = true;
                       else if ( opsArray[i] === 'memory' )
                           ops.memory = true;
                       else if ( opsArray[i] === 'unique' )
                           ops.unique = true;
                       else if ( opsArray[i] === 'stopOnFalse' )
                           ops.stopOnFalse = true;
                   }
               }

               function hasName( name )
               {
                   var h = false;

                   if ( typeof name === 'string'
                       && name !== null
                       && name.trim() !== ''
                       && ar.length > 0 )
                   {
                       for ( var i = 0; i < ar.length; i++ )
                       {
                           if ( ar[i].name === name )
                           {
                               h = true;
                               break;
                           }
                       }
                   }

                   return h;
               }

               // add a function
               this.add = function ( fn )
               {
                   if ( typeof fn === 'function' )
                   {
                       if ( ops.unique )
                       {
                           // check whether it had been added before
                           if ( fn.name !== '' && hasName( fn.name ) )
                           {
                               return this;
                           }
                       }

                       ar.push( fn );

                       if ( ops.memory )
                       {
                           // after added , call it immediately
                           fn.call( this, lastArgs );
                       }
                   }

                   return this;
               };

               // remove a function
               this.remove = function ( fn )
               {
                   if ( typeof ( fn ) === 'function'
                       && fn.name !== ''
                       && ar.length > 0 )
                   {
                       for ( var i = 0; i < ar.length; i++ )
                       {
                           if ( ar[i].name === fn.name )
                           {
                               ar.splice( i, 1 );
                           }
                       }
                   }

                   return this;
               };

               // remove all functions
               this.empty = function ()
               {
                   ar.length = 0;
                   return this;
               };

               // check whether it includes a specific function
               this.has = function ( fn )
               {
                   var f = false;

                   if ( typeof ( fn ) === 'function'
                       && fn.name !== ''
                       && ar.length > 0 )
                   {
                       for ( var i = 0; i < ar.length; i++ )
                       {
                           if ( ar[i].name === fn.name )
                           {
                               f = true;
                               break;
                           }
                       }
                   }

                   return f;
               };

               this.disable = function ()
               {
                   _disabled = true;
                   return this;
               };

               this.disabled = function ()
               {
                   return _disabled;
               };

               this.fired = function ()
               {
                   return firedTimes > 0;
               };

               function _fire( context, args )
               {
                   if ( _disabled || ops.once && firedTimes > 0 || _locked )
                   {
                       return;
                   }

                   if ( ar.length > 0 )
                   {
                       var r;

                       for ( var i = 0; i < ar.length; i++ )
                       {
                           r = ar[i].call( context, args );

                           if ( ops.stopOnFalse && r === false )
                           {
                               break;
                           }
                       }
                   }

                   firedTimes++;

                   if ( ops.memory )
                   {
                       lastArgs = args;
                   }

               };

               this.fireWith = function ( context, args )
               {
                   context = context || this;
                   _fire( context, args );
                   return this;
               };

               this.fire = function ( args )
               {
                   _fire( this, args );
                   return this;
               };

               this.lock = function ()
               {
                   _locked = true;
                   return this;
               };

               this.locked = function ()
               {
                   return _locked;
               };

           };

           // exposed to global as a factory method
           window.callbacks = function ( options )
           {
               return new Callbacks( options );
           };

       } )( window );