Key Points of jQuery Callbacks applications

Key Points of jQuery Callbacks applications

Callbacks is a method introduced by jQuery 1.7 to manage a series of callback functions that use the same parameters. All callback functions (called callbacks) are stored in an array and can be called repeatedly. In essence, it is equivalent to a callback function column (List). Therefore, you can add, delete, and clear callback functions.

Callbacks)

 

var callbacks = $.Callbacks();

 

Callback execution sequence

The callback is saved in the array and then traversed through the for loop. Therefore, the callback in the column is executed in the order of addition, And the last addition is generally executed.

 

// Fire the items on the listvar foo = function( value ) {  console.log( "foo:" + value );};// Add another function to the listvar bar = function( value ){  console.log( "bar:" + value );};var callbacks = $.Callbacks();callbacks.add( foo );callbacks.add( bar);callbacks.fire("hello"); // output: foo: hello// output: bar: hello

 

The only exception is that if memory is marked, and fire () is called before, the new callback is added () once added, the previous fire parameter is immediately used for execution. However, if a callback called by fire () before add () is not used, it will not be executed again immediately.

Four tags: once, memory, unique, stopOnFalse

 

Once: Each callback in the column can be executed Once at most. After the execution is completed, the callback function column is cleared. Memory: Remember the previous fire () parameter. Once a new callback is added, the previous parameter is used for execution immediately (the previously added callback is not executed ). Unique: The same callback cannot be added again. StopOnFalse: If a callback returns false, the subsequent callback will not be executed.

 

Markup setting example:

 

var callbacks = $.Callbacks("once memory");

 

After callbacks. disable () is called at other key points, callbacks cannot be enabled again.

After disable () is called, The callback function column is cleared, and no response is returned when fire or fireWith is used. Therefore, Callbacks does not provide the enable method, because all Callbacks have been cleared and there is no need for enable.

Call the fire () or fireWith () of Callbacks In the callback function ()

In one case, the fire () or fireWith () of callbacks is called again in the callback. What should I do in this case? JQuery does this: when fire () or fireWith () is used in the callback, callbacks only saves the fire () or fireWith () parameters and does not immediately execute the callback in the column. The new parameter is used by the callback in callbacks only after all callback operations are completed.

 

function fn1( value ){   console.log( value );    if (value == "bar!") return false;    callbacks.fire("bar!");} function fn2( value ){  console.log( "fn2 says: " + value);} var callbacks =$.Callbacks("stopOnFalse"); callbacks.add( fn1 );callbacks.add( fn2 ); // Outputs: foo!// Outputs: fn2 says:foo!// Outputs: bar!callbacks.fire("foo!" );

 

Callbacks. lock ()

When the callback column is locked, calling callbacks. fire () or callbacks. fireWith () will become invalid.

If callbacks. lock () is called in the callback, note the following:

 

Callbacks has a memory MARK: the callback that is not executed in the current fire () or fireWith () method will continue to be executed, but the callbacks In the callback. fire () and callbacks. fireWith () does not work any more. Callbacks has no memory MARK: All callbacks are cleared, which means the subsequent callbacks are not executed.

 

The strange thing is that Callbacks does not provide the unlock method, that is, once it is locked, Callbacks will permanently lose the ability to call fire () or fireWith.