Promise error handling in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this Promise chain?

Consider the following JavaScript code. What will be printed to the console?

Javascript

Promise.resolve(5)
  .then(value => {
    console.log(value);
    return value * 2;
  })
  .then(value => {
    throw new Error('Oops');
  })
  .catch(error => {
    console.log('Error caught:', error.message);
    return 10;
  })
  .then(value => {
    console.log('Final value:', value);
  });

A Error caught: Oops\nFinal value: 10

B 5\nError caught: Oops\nFinal value: 10

C 5\nFinal value: 10

D 5\nError caught: Oops

💡 Hint

Remember that a catch block handles errors and the chain continues after catch.

The first then logs 5 and returns 10. The second then throws an error. The catch catches it and logs the error message, then returns 10. The final then logs 'Final value: 10'.

❓ Predict Output

intermediate

What happens if a Promise rejects without a catch?

What will be the output or error when running this code?

Javascript

Promise.reject('Failed')
  .then(() => {
    console.log('Success');
  });

A SyntaxError

B Success

C No output

D Uncaught (in promise) Failed

💡 Hint

Think about what happens when a rejection is not handled.

The Promise rejects but there is no catch to handle it, so the error is unhandled and logged as 'Uncaught (in promise) Failed'.

❓ Predict Output

advanced

What is the output of this async function with try/catch?

Analyze the following code and select the correct console output.

Javascript

async function test() {
  try {
    await Promise.reject('Error!');
  } catch (e) {
    console.log('Caught:', e);
  }
  console.log('Done');
}
test();

A Caught: Error!\nDone

B Done\nCaught: Error!

C Uncaught (in promise) Error!

D SyntaxError

💡 Hint

Remember that try/catch works with await inside async functions.

The await rejects, so control goes to catch which logs the error. Then the function continues and logs 'Done'.

❓ Predict Output

advanced

Which option correctly handles errors in this Promise chain?

Given this code, which option will print 'Error handled' when the Promise rejects?

Javascript

function getData() {
  return new Promise((resolve, reject) => {
    reject('Network error');
  });
}

getData()
  .then(data => console.log('Data:', data))
  // Error handling here
  ;

A .finally(() => console.log('Error handled'))

B .then(error => console.log('Error handled'))

C .catch(error => console.log('Error handled'))

D .then(() => {}, error => console.log('Error handled'))

💡 Hint

Which method catches rejected Promises?

The catch method handles rejected Promises. Option C looks similar but the second argument to then is less common and can cause confusion.

🧠 Conceptual

expert

What is the output of this complex Promise error handling?

What will be printed to the console when this code runs?

Javascript

Promise.resolve('Start')
  .then(value => {
    console.log(value);
    return Promise.reject('Fail');
  })
  .catch(error => {
    console.log('Caught:', error);
    return 'Recovered';
  })
  .then(value => {
    console.log(value);
    throw new Error('Crash');
  })
  .catch(error => {
    console.log('Final catch:', error.message);
  });

A Start\nCaught: Fail\nRecovered\nFinal catch: Crash

B Start\nCaught: Fail\nFinal catch: Crash

C Start\nRecovered\nFinal catch: Crash

D Start\nCaught: Fail\nRecovered

💡 Hint

Follow the chain carefully, noting where errors are caught and what is returned.

The first then logs 'Start' and rejects with 'Fail'. The first catch logs 'Caught: Fail' and returns 'Recovered'. The next then logs 'Recovered' and throws 'Crash'. The final catch logs 'Final catch: Crash'.