OnlineCBT Logo OnlineCBT
JavaScript Tutorial
JAVASCRIPT · LESSON 24

Promises: Creation, .then(), .catch(), and .finally()

By Ratan Updated: 16 Oct 2026

Handle asynchronous operations cleanly using Promises, resolve/reject states, and chaining.

Level: Beginner to Advanced
Duration: ~60 Mins Deep-Dive

Represent a future outcome

A promise is pending, fulfilled or rejected. It settles once, and chained handlers observe or transform its outcome. The Promise constructor's executor runs synchronously; then/catch handlers run asynchronously after the current work.

function delay(milliseconds) {
  return new Promise((resolve, reject) => {
    if (!Number.isFinite(milliseconds) || milliseconds < 0) {
      reject(new RangeError('Use a nonnegative delay'));
      return;
    }
    setTimeout(() => resolve('Ready'), milliseconds);
  });
}
delay(100)
  .then(message => message.toUpperCase())
  .then(message => console.log(message)) // READY
  .catch(error => console.error(error.message))
  .finally(() => console.log('Finished waiting'));

Return from a chain

A then handler returns a value or another promise, producing the next link in the chain. If you start asynchronous work inside it but forget to return that promise, the outer chain can continue too early. Throwing in a handler rejects the resulting promise.

catch and finally

catch handles rejection. Returning a normal value from catch recovers the chain with fulfillment. finally is for cleanup and normally preserves the original result; throwing or returning a rejected promise there can replace it. Do not silently catch every error and pretend the requested operation succeeded.

Combine independent work

Promise.all([delay(10), delay(20)])
  .then(results => console.log(results)); // ['Ready', 'Ready']

Promise.all retains input order in its results, not completion order. It rejects when an input rejects but does not automatically cancel other work. Use allSettled when you need every outcome, and bound concurrency when a large list would overload a service.

Practice

  1. Call delay(-1) and confirm the rejection is handled.
  2. Log before delay and after registering then; predict handler timing.
  3. Chain a second delay by returning it from the first then.
  4. Explain why a promise is not the final value until its outcome is observed through a handler or await.

📝 Live Lesson Practice

HTML/CSS JavaScript Python C++ C PHP
⌨️ Practice Inputs (लाइव इनपुट भरें) (खाली होने पर RED, भरने पर GREEN underline)
💻 Code Editor (Monaco VS Code Engine)
👀 Live Preview
Address Contact

+91 7877547686

E-mail

onlinecbtportal@gmail.com

Helpline Number

+91 7877547686


Click To Download
Get it on Google Play

ऐप डाउनलोड करने
के लिए Google Play पर
उपलब्ध है

WhatsApp Chat