jQuery Deferred always() Method

What You’ll Learn

The always() method attaches a callback that runs when a jQuery Deferred settles — whether the operation succeeded or failed. This tutorial covers syntax, five worked examples, comparisons with done() and fail(), and practical cleanup patterns for AJAX and custom async tasks.

Introduction

Asynchronous work — AJAX calls, animations, timers — rarely finishes instantly. jQuery’s Deferred object lets you register handlers for success (done()), failure (fail()), and progress (progress()). The always() method fills a different role: it runs code you need no matter which outcome occurred.

Typical jobs for always() include hiding loading indicators, re-enabling submit buttons, closing modal overlays, and writing audit logs. Keep outcome-specific logic in done() or fail(); keep shared teardown in always().

Understanding the always() Method

always() is part of jQuery’s Deferred Object API. When you call deferred.always(callback), jQuery queues your function and invokes it once the Deferred enters a resolved or rejected state. It does not run while the operation is still pending.

The callback receives the same arguments passed to resolve() or reject(). That makes it easy to log context, though most cleanup code ignores those values.

📝 Syntax

General form of deferred.always:

deferred.always( alwaysCallback [, alwaysCallback ] )

Parameters

• alwaysCallback — function executed when the Deferred is resolved or rejected. You may pass multiple functions; each is called in registration order.

Return value

• Returns the same Deferred object, so you can chain .done(), .fail(), or another .always().

AJAX-style chain

$.ajax({
  url: "/api/profile",
  method: "GET"
})
  .done(function (response) {
    renderProfile(response);
  })
  .fail(function (xhr, status, error) {
    showError(error);
  })
  .always(function () {
    hideSpinner();
  });

Examples Gallery

Each example uses jQuery’s Deferred API. Open DevTools or use the Try-it links to run them interactively.

const dfd = $.Deferred();

dfd.done(function (value) {
  console.log("done:", value);
});

dfd.always(function () {
  console.log("always: request finished");
});

dfd.resolve("OK");

done: OK
always: request finished

const dfd = $.Deferred();

dfd.fail(function (reason) {
  console.log("fail:", reason);
});

dfd.always(function () {
  console.log("always: cleanup runs anyway");
});

dfd.reject("Network error");

fail: Network error
always: cleanup runs anyway

function fetchProfile() {
  const dfd = $.Deferred();

  // Simulate async work
  setTimeout(function () {
    if (Math.random() > 0.5) {
      dfd.resolve({ name: "Alex" });
    } else {
      dfd.reject("404 Not Found");
    }
  }, 300);

  return dfd
    .done(function (data) {
      console.log("Profile:", data.name);
    })
    .fail(function (err) {
      console.warn("Request failed:", err);
    })
    .always(function () {
      console.log("Re-enable submit button");
    });
}

Profile: Alex
Re-enable submit button

— or —

Request failed: 404 Not Found
Re-enable submit button

function loadItems() {
  $("#spinner").show();

  const dfd = $.Deferred();

  setTimeout(function () {
    dfd.resolve(["apple", "banana"]);
  }, 800);

  dfd
    .done(function (items) {
      $("#list").text(items.join(", "));
    })
    .fail(function () {
      $("#list").text("Could not load items.");
    })
    .always(function () {
      $("#spinner").hide();
    });
}

1. Spinner visible while pending
2. List updates on success OR error message on fail
3. Spinner hidden in always() — every time

const dfd = $.Deferred();

dfd.always(function () {
  console.log("Log event");
});

dfd.always(function () {
  console.log("Release UI lock");
});

dfd.always(function () {
  console.log("Send analytics beacon");
});

dfd.resolve("finished");

Log event
Release UI lock
Send analytics beacon

🚀 Use Cases

• Cleanup tasks — close connections, release locks, or reset module state after async work completes.
• Loading indicators — show spinners on start, hide them in always() so failures do not leave the UI stuck.
• Logging and monitoring — record that a request finished, with timing metadata, independent of success.
• UI updates — re-enable buttons, remove disabled classes, or restore focus after form submission.
• Fallback preparation — pair with fail() for error messages while always() handles shared teardown.

📝 Notes

• always() does not run while the Deferred is still pending.
• Put outcome-specific logic in done() or fail(), not in always().
• jqXHR from $.ajax() supports the same chaining methods as a Deferred.
• Returning a new Deferred from an always() callback does not change the original Deferred’s state.
• In greenfield code without jQuery, consider native Promise.prototype.finally() for the same pattern.

💡 Best Practices