jQuery $.Callbacks() Method

What You’ll Learn

The $.Callbacks() factory creates a managed list of functions you can register with add() and run with fire(). Optional flags control firing behavior. This tutorial covers syntax, all four flags, five worked examples, and how Callbacks power jQuery Deferred internally.

Introduction

JavaScript apps constantly coordinate work through callbacks — functions passed to run later when data arrives, a user clicks, or a timer finishes. Scattering those functions across nested calls gets messy fast. jQuery’s Callbacks object gives you a reusable list with a small, predictable API.

The entry point is $.Callbacks(). It returns a fresh list you configure with optional flags, populate via add(), and trigger with fire(). jQuery itself uses this machinery inside Deferred for done, fail, and related queues.

Understanding the $.Callbacks() Method

$.Callbacks([flags]) is a factory function, not a method on an existing object. Each call produces an independent callback list with methods like add, remove, fire, lock, and disable.

Without flags, the list behaves simply: every fire() invokes all registered handlers in order. Flags tweak that behavior — run only once, recall last arguments for late subscribers, skip duplicate functions, or halt when a handler returns false.

📝 Syntax

General form of the factory:

jQuery.Callbacks( [ flags ] )

Parameters

• flags (optional) — a string of space-separated behavior modifiers. Omit for default multi-fire behavior.

Available flags

Minimal example

const callbacks = $.Callbacks();



callbacks.add(function () {

  console.log("Callback 1 executed");

});



callbacks.fire(); // → Callback 1 executed

Examples Gallery

Each example demonstrates a different flag or default behavior. Use Try-it labs to run them in the browser.

const callbacks = $.Callbacks();



callbacks.add(function () {

  console.log("Callback 1 executed");

});



callbacks.fire();

// → Callback 1 executed



callbacks.add(function () {

  console.log("Callback 2 executed");

});



callbacks.fire();

// → Callback 1 executed

// → Callback 2 executed

Callback 1 executed

Callback 1 executed

Callback 2 executed

const callbacks = $.Callbacks("once");



callbacks.add(function () {

  console.log("Runs on first fire only");

});



callbacks.fire();

callbacks.fire(); // ignored — list already fired

Runs on first fire only

const callbacks = $.Callbacks("memory");



callbacks.fire("ready", { version: 1 });



callbacks.add(function (event, data) {

  console.log(event, "v" + data.version);

});

// → ready v1  (fires immediately on add)

ready v1

const callbacks = $.Callbacks("unique");



function onChange() {

  console.log("Changed");

}



callbacks.add(onChange);

callbacks.add(onChange); // ignored — same reference



callbacks.fire(); // → Changed (once)

Changed

const callbacks = $.Callbacks("stopOnFalse");



callbacks.add(function () {

  console.log("Step 1: pass");

});



callbacks.add(function () {

  console.log("Step 2: block");

  return false;

});



callbacks.add(function () {

  console.log("Step 3: never reached");

});



callbacks.fire();

Step 1: pass

Step 2: block

🚀 Use Cases

• Custom events — expose $.Callbacks() lists as onReady, onChange, or onDestroy hooks.
• Modular development — decouple publishers (fire) from subscribers (add) inside a module.
• Asynchronous coordination — queue steps that run when a long task completes.
• Plugin extensibility — ship a plugin with internal Callbacks lists third parties can extend.
• Deferred internals — understand how jQuery queues done/fail/progress handlers under the hood.

📝 Notes

• Flags are fixed at creation — combine them in one string: "once memory unique".
• memory without a prior fire() does nothing special on add().
• unique compares function references, not logical equality.
• Lists can be lock()ed or disable()d after creation — see those tutorials.
• Deferred’s done queue uses Callbacks with "once memory" semantics internally.

💡 Best Practices