catch()?deferred.catch(failFilter) adds a handler that runs when the Deferred is rejected (since jQuery 3.0). Officially it is an alias for deferred.then(null, fn) and returns a Promise. Use it for promise-style error handling, just like native Promise.catch.
dfd.catch(fn) ≡ dfd.then(null, fn)
// Official AJAX-style pattern:
$.get("test.php")
.then(function () { /* success */ })
.catch(function () { /* failed */ });
// Older equivalent:
dfd.fail(fn)| Need | Use |
|---|---|
| Handle rejection (modern) | dfd.catch(fn) |
| Handle rejection (classic) | dfd.fail(fn) |
| Success path | dfd.then(fn) |
| Cleanup either way | dfd.always(fn) |
catch()Build a then/catch chain, then settle the Deferred.
$.get / $.ajax)..then(successFn) for the happy path..catch(failFn) for rejections and thrown errors.resolve() / reject() (or wait for AJAX).| Piece | Required? | Role |
|---|---|---|
| Deferred / Promise | Yes | Object that may reject |
| failFilter | Yes | Function called on rejection |
| Return | — | Promise (chainable) |
catch(fn):
return then(null, fn) // official alias
on reject(reason) OR throw in then():
call failFilter(reason)
if failFilter returns value:
next then() can continue (recovered)
if failFilter throws / returns rejected:
chain stays rejectedKeep these facts handy for Deferred error handling.
| Topic | Detail |
|---|---|
| Syntax | deferred.catch( failFilter ) |
| Alias | deferred.then( null, failFilter ) |
| Runs when | Rejected (or throw / rejected promise in chain) |
| Success? | Skipped |
| Returns | Promise |
vs fail() | Same idea; catch is promise-style (3.0+) |
| Since | jQuery 3.0 |
Compare reject, success skip, thrown errors, and multi-step propagation.
Short, copy-ready snippets (jQuery 3+). Open DevTools Console, or use Try It Yourself for a live editor.
Register catch(), then reject() with an error message.
var dfd = $.Deferred();
dfd.catch(function (error) {
console.log("catch:", error);
});
dfd.reject("Network timeout");then() / catch() ChainProcess success in then(); route failures to catch().
var dfd = $.Deferred();
dfd
.then(function (result) {
console.log("Profile:", result.name);
})
.catch(function (error) {
console.log("Failed:", error);
});
dfd.resolve({ name: "Alex" });
// → Profile: Alex
// (catch skipped)then()Throwing in a then() callback becomes a rejection that catch() handles.
$.Deferred()
.resolve({ id: 0 })
.then(function (data) {
if (!data.id) {
throw new Error("Invalid user id");
}
console.log("Valid id:", data.id);
})
.catch(function (err) {
console.log("catch:", err.message);
});id is falsy → throw.Simulate a failed request and show a user-friendly message in catch().
function fetchItems() {
var dfd = $.Deferred();
setTimeout(function () {
dfd.reject("Server unavailable (503)");
}, 200);
return dfd
.then(function (items) {
console.log("Loaded:", items.join(", "));
})
.catch(function (error) {
console.log("Could not load items — " + error);
});
}
fetchItems();$.get(...).then(...).catch(...).catch() for a Multi-Step ChainPlace one error handler at the end; rejections from any step bubble to it.
function stepOne() {
return $.Deferred().resolve(10).promise();
}
function stepTwo(value) {
return $.Deferred().resolve(value * 2).promise();
}
function stepThree(value) {
return $.Deferred().reject("Step 3 failed at " + value).promise();
}
stepOne()
.then(stepTwo)
.then(stepThree)
.then(function (final) {
console.log("success:", final);
})
.catch(function (error) {
console.log("catch:", error);
});10.20.20.catch() handles the pipeline.Check these before relying on catch() in chains.
catch is jQuery 3.0+. Older code must use fail() or then(null, fn).
A successful chain never enters catch(). Put success work in then() / done().
If catch returns a normal value, later then() handlers can run again — intentional recovery.
A catch in the middle can swallow an error so later steps still run. Terminal catch is usually clearer.
always()Catch is error-only. Spinner hide / unlock still belongs in always().
deferred.catch() is part of jQuery’s Deferred API (since 3.0). It works in any browser where jQuery 3.x runs. For jQuery 1.x/2.x, use fail() or then(null, fn).
Supported in jQuery 3.x across Chrome, Firefox, Safari, Edge, and other browsers with jQuery 3 loaded. Not available in jQuery 1.x / 2.x.
Bottom line: Use catch() on jQuery 3+. On older projects, prefer fail() — same rejection idea, different method name.
| Operation | Cost | Best for |
|---|---|---|
catch(fn) | O(1) register | Attaching one rejection handler |
| Reject + catch | O(n) handlers | Running fail filters in order |
| Per-step catch | More queues | Prefer one terminal catch unless recovering mid-chain |
Registering catch() is cheap. Prefer one terminal catch for a pipeline unless you intentionally recover mid-chain. Keep handlers light — log, map to a user message, or return a fallback value.
catch(fn) ≡ then(null, fn).then() also land in catch().fail().One line: catch() is the modern Deferred rejection hook — same idea as native Promise catch.
Learn how to create Deferred objects and control resolve, reject, and progress.
8 people found this page helpful