Error handling in async/await in Node.js - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to catch errors in an async function using try/catch.

Node.js

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    return data;
  } catch ([1]) {
    console.error('Error:', error);
  }
}

Drag options to blanks, or click blank then click option'

Aerror

Berr

Cexception

De

Attempts:

3 left

💡 Hint

Common Mistakes

Using a variable name in catch that doesn't match the one used inside the block.

The catch block receives the error object. Naming it error is common and matches the usage inside the block.

2fill in blank

medium

Complete the code to rethrow an error after logging it in an async function.

Node.js

async function getUser() {
  try {
    const user = await fetchUserFromDB();
    return user;
  } catch ([1]) {
    console.error('Failed to get user:', err);
    throw err;
  }
}

Drag options to blanks, or click blank then click option'

Aerr

Berror

Ce

Dexception

Attempts:

3 left

💡 Hint

Common Mistakes

Using a different variable name in catch than inside the block.

The catch block uses err to log and rethrow the error, so the variable name must be err.

3fill in blank

hard

Fix the error in the async function to properly handle errors with try/catch.

Node.js

async function loadData() {
  try {
    const result = await fetchData();
    return result;
  } catch ([1]) {
    console.error('Error loading data');
  }
}

Drag options to blanks, or click blank then click option'

Aexception

Berr

Ce

Derror

Attempts:

3 left

💡 Hint

Common Mistakes

Leaving catch parentheses empty, which prevents access to the error object.

The catch block must include a variable to receive the error object for proper error handling and logging.

4fill in blank

hard

Fill both blanks to create an async function that handles errors and returns a default value.

Node.js

async function fetchWithDefault() {
  try {
    const data = await fetchData();
    return data;
  } catch ([1]) {
    console.error('Fetch failed:', [2]);
    return null;
  }
}

Drag options to blanks, or click blank then click option'

Aerror

Berr

Ce

Dexception

Attempts:

3 left

💡 Hint

Common Mistakes

Using different variable names in catch and console.error.

Using the same variable name error in both blanks matches the catch parameter and the logged error.

5fill in blank

hard

Fill all three blanks to create an async function that tries to fetch data, logs errors, and throws a new error.

Node.js

async function getData() {
  try {
    const response = await fetch('https://api.example.com');
    const data = await response.json();
    return data;
  } catch ([1]) {
    console.error('Fetch error:', [2]);
    throw new [3]('Failed to get data');
  }
}

Drag options to blanks, or click blank then click option'

Aerror

Berr

CError

DException

Attempts:

3 left

💡 Hint

Common Mistakes

Mismatching variable names between catch and console.error.

Throwing a non-existent error class.

The catch parameter is err (B), the logged error is err (B), and the thrown error is a new Error object (C).

Practice

1. What is the main purpose of using try/catch blocks with async/await in Node.js?

easy

A. To catch and handle errors from asynchronous operations

B. To speed up the execution of async functions

C. To convert async functions into synchronous ones

D. To automatically retry failed async operations

Solution

1. Step 1: Understand async/await behavior

   Async functions return promises and can throw errors when awaited operations fail.

2. Step 2: Role of try/catch

   Try/catch blocks catch these errors to prevent crashes and allow handling.

3. Final Answer:

   To catch and handle errors from asynchronous operations -> Option A

4. Quick Check:

   Error handling = A [OK]

Hint: Use try/catch around await to catch errors [OK]

Common Mistakes:

• Thinking async/await automatically handles errors
• Using try/catch outside async functions only
• Ignoring errors causing app crashes

2. Which of the following is the correct syntax to handle errors in an async function using async/await?

easy

A. async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } }

B. async function fetchData() { await fetch(url); }

C. async function fetchData() { try { fetch(url); } catch (err) { console.error(err); } }

D. async function fetchData() { await fetch(url).catch(console.error); }

Solution

1. Step 1: Check proper use of try/catch with await

   async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } } correctly wraps the await call inside try and catches errors.

2. Step 2: Identify incorrect patterns

   async function fetchData() { await fetch(url).catch(console.error); } uses .catch on await which is invalid syntax; async function fetchData() { try { fetch(url); } catch (err) { console.error(err); } } misses await; async function fetchData() { await fetch(url); } has no error handling.

3. Final Answer:

   async function fetchData() { try { await fetch(url); } catch (err) { console.error(err); } } -> Option A

4. Quick Check:

   Try/catch with await = D [OK]

Hint: Put await inside try block to catch errors [OK]

Common Mistakes:

• Using .catch() directly on await expression
• Forgetting to use await inside try
• Not catching errors at all

3. Consider this code snippet:

async function getData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    return data;
  } catch (error) {
    return 'Error occurred';
  }
}

getData().then(console.log);

What will be logged if the fetch fails due to network error?

medium

A. An unhandled promise rejection error

B. The raw error object

C. Undefined

D. 'Error occurred'

Solution

1. Step 1: Analyze try/catch behavior on fetch failure

   If fetch fails, control jumps to catch block which returns 'Error occurred'.

2. Step 2: Understand promise resolution

   getData returns a resolved promise with string 'Error occurred', so console.log prints that string.

3. Final Answer:

   'Error occurred' -> Option D

4. Quick Check:

   Catch returns string on error = B [OK]

Hint: Catch block return value is logged on error [OK]

Common Mistakes:

• Expecting unhandled error instead of caught return
• Confusing error object with returned string
• Ignoring async function returns promise

4. Identify the error in this async function:

async function loadUser() {
  try {
    const user = fetch('https://api.example.com/user');
    console.log(user.name);
  } catch (err) {
    console.error(err);
  }
}

medium

A. Incorrect catch block syntax

B. Missing await before fetch causing user to be a Promise

C. console.log should be inside catch block

D. fetch URL is invalid

Solution

1. Step 1: Check fetch usage

   fetch returns a Promise; without await, user is a Promise object, not the resolved data.

2. Step 2: Consequence of missing await

   Accessing user.name fails because user is not the actual data but a Promise.

3. Final Answer:

   Missing await before fetch causing user to be a Promise -> Option B

4. Quick Check:

   Await missing = A [OK]

Hint: Always await fetch to get resolved data before use [OK]

Common Mistakes:

• Forgetting await before async calls
• Assuming fetch returns data directly
• Misplacing console.log outside async flow

5. You want to fetch user data and then fetch posts by that user. Both calls can fail. How should you handle errors to ensure you catch failures in either step and log a clear message?

async function getUserPosts(userId) {
  // Your code here
}

hard

A. Use nested try/catch blocks: one for user fetch, one for posts fetch

B. Use .then().catch() chaining instead of async/await

C. Use a single try/catch wrapping both awaits for user and posts fetch

D. Ignore errors and let them crash the app

Solution

1. Step 1: Understand error flow in async/await

   A single try/catch can catch errors from any awaited call inside it.

2. Step 2: Simplify error handling

   Wrapping both awaits in one try/catch logs errors clearly without nesting complexity.

3. Final Answer:

   Use a single try/catch wrapping both awaits for user and posts fetch -> Option C

4. Quick Check:

   One try/catch covers multiple awaits = C [OK]

Hint: Wrap all awaits in one try/catch for simple error handling [OK]

Common Mistakes:

• Overcomplicating with nested try/catch
• Using .then().catch() mixing styles
• Not handling errors causing silent failures