Promise error handling in Javascript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of .catch() in a JavaScript Promise?

.catch() is used to handle errors or rejections that happen in a Promise chain. It catches any error thrown or rejection from the Promise and lets you respond to it.

beginner

How does try...catch work with async/await for error handling?

When using async/await, you can wrap the await call inside a try block. If the Promise rejects, the error is caught in the catch block, allowing you to handle it cleanly.

beginner

What happens if you don't handle a rejected Promise?

If a Promise rejects and you don't handle it with .catch() or try...catch, it causes an unhandled promise rejection. This can crash your program or cause unexpected behavior.

intermediate

Can you chain multiple .catch() handlers on a Promise?

No, only the first .catch() in the chain will catch the error. After an error is caught, the chain continues normally unless you throw another error.

intermediate

How can you handle errors in multiple Promises running in parallel?

You can use Promise.allSettled() to wait for all Promises to finish, then check which ones failed. Or use Promise.all() with a .catch() to handle if any reject.

Which method is used to catch errors in a Promise chain?

A .catch()

B .then()

C .finally()

D .resolve()

.catch() is specifically designed to handle errors or rejections in Promises.

What happens if a Promise rejects but no .catch() is provided?

A The error is ignored silently

B An unhandled promise rejection occurs

C The Promise automatically retries

D The Promise resolves with undefined

Without a .catch(), rejected Promises cause unhandled promise rejections, which can crash the program.

How do you handle errors when using async/await?

A Use <code>.catch()</code> after the await

B Use <code>finally</code> block only

C Errors are handled automatically

D Wrap the <code>await</code> call in a <code>try...catch</code> block

Errors from await can be caught using try...catch blocks.

Which Promise method lets you wait for all Promises to finish regardless of success or failure?

A Promise.allSettled()

B Promise.race()

C Promise.all()

D Promise.resolve()

Promise.allSettled() waits for all Promises to settle, whether fulfilled or rejected.

If you want to handle errors only once in a Promise chain, where should you place .catch()?

A At the start of the chain

B After every <code>.then()</code>

C At the end of the chain

D You don't need <code>.catch()</code>

Placing .catch() at the end catches any error from the entire chain.

Explain how to handle errors in a Promise chain using .catch().

Think about how you catch mistakes in a sequence of steps.

Describe how try...catch works with async/await for error handling.

Imagine waiting for a task and catching problems as if it was normal code.

Practice

1. What is the main purpose of the .catch() method when working with JavaScript Promises?

easy

A. To create a new promise

B. To handle errors or rejected promises

C. To execute code after a promise resolves successfully

D. To cancel a running promise

Solution

1. Step 1: Understand the role of .catch() in Promises

   The .catch() method is designed to handle errors or rejected promises in asynchronous code.

2. Step 2: Differentiate from other methods

   .then() handles successful resolution, while .catch() specifically catches errors.

3. Final Answer:

   To handle errors or rejected promises -> Option B

4. Quick Check:

   .catch() handles errors [OK]

Hint: Remember: .catch() is for errors, .then() is for success [OK]

Common Mistakes:

• Confusing .catch() with .then()
• Thinking .catch() cancels promises
• Believing .catch() creates new promises

2. Which of the following is the correct syntax to catch errors from a promise named myPromise?

easy

A. myPromise.catch(error => console.log(error));

B. myPromise.then(error => console.log(error));

C. myPromise.error(error => console.log(error));

D. myPromise.handleError(error => console.log(error));

Solution

1. Step 1: Identify the correct method for error handling

   The correct method to catch errors from a promise is .catch().

2. Step 2: Check the syntax correctness

   The syntax myPromise.catch(error => console.log(error)); correctly attaches an error handler.

3. Final Answer:

   myPromise.catch(error => console.log(error)); -> Option A

4. Quick Check:

   Use .catch() for errors [OK]

Hint: Use .catch() after promise to handle errors [OK]

Common Mistakes:

• Using .then() to catch errors
• Using non-existent methods like .error()
• Incorrect arrow function syntax

3. What will be the output of the following code?

const p = new Promise((resolve, reject) => {
  reject('Failed');
});

p.then(result => console.log('Success:', result))
 .catch(error => console.log('Error:', error));

medium

A. Success: Failed

B. SyntaxError

C. No output

D. Error: Failed

Solution

1. Step 1: Analyze the promise rejection

   The promise immediately rejects with the message 'Failed'.

2. Step 2: Trace the .then() and .catch() handlers

   The .then() is skipped because the promise is rejected; .catch() runs and logs 'Error: Failed'.

3. Final Answer:

   Error: Failed -> Option D

4. Quick Check:

   Rejected promise triggers .catch() [OK]

Hint: Rejected promises skip .then() and go to .catch() [OK]

Common Mistakes:

• Expecting .then() to run on rejection
• Thinking no output occurs on rejection
• Confusing reject with resolve

4. Identify the error in this code snippet and choose the correct fix:

fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.log('Error:', error));

// What is wrong here?

medium

A. Should use .error() instead of .catch()

B. Missing return in first .then() to pass parsed JSON

C. No error, code is correct

D. fetch() does not return a promise

Solution

1. Step 1: Review the promise chain syntax

   The code correctly chains .then() to parse JSON and then log data.

2. Step 2: Confirm error handling

   The .catch() properly handles any errors from fetch or JSON parsing.

3. Final Answer:

   No error, code is correct -> Option C

4. Quick Check:

   Proper chaining with .catch() [OK]

Hint: fetch returns promise; .then() chaining is correct [OK]

Common Mistakes:

• Thinking .then() needs explicit return (arrow with braces)
• Using .error() instead of .catch()
• Believing fetch is not promise-based

5. You want to handle errors in a promise chain but also continue processing even if an error occurs. Which pattern correctly achieves this?

fetch('https://api.example.com/data')
  .then(response => response.json())
  .catch(error => {
    console.log('Error:', error);
    return {};
  })
  .then(data => console.log('Data:', data));

hard

A. This pattern catches errors and returns a default value to continue processing

B. This pattern stops execution after an error and does not continue

C. Errors are not caught because .catch() is after .then()

D. This pattern causes an infinite loop

Solution

1. Step 1: Understand the error handling flow

   The .catch() catches any errors from the fetch or JSON parsing.

2. Step 2: Analyze the return inside .catch()

   Returning an empty object {} allows the next .then() to receive a value and continue processing.

3. Final Answer:

   This pattern catches errors and returns a default value to continue processing -> Option A

4. Quick Check:

   Return in .catch() continues chain [OK]

Hint: Return a value in .catch() to keep promise chain going [OK]

Common Mistakes:

• Assuming .catch() stops the chain without return
• Not returning a value inside .catch()
• Thinking .catch() after .then() won't catch errors