Async/await syntax in Node.js - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare an asynchronous function.

Node.js

async function fetchData() {
  const data = await fetch([1]);
  return data.json();
}

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

Aasync 'https://api.example.com/data'

Bfetch('https://api.example.com/data')

Cawait 'https://api.example.com/data'

D'https://api.example.com/data'

Attempts:

3 left

💡 Hint

Common Mistakes

Putting fetch inside the blank instead of just the URL string.

Using await inside the argument of fetch.

Not using quotes around the URL string.

The fetch function takes a URL string as argument. Here, the URL string must be passed inside the fetch() call. The await keyword waits for the fetch promise to resolve.

2fill in blank

medium

Complete the code to wait for the promise result inside an async function.

Node.js

async function getUser() {
  const user = [1] fetchUserFromDB();
  return user;
}

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

Aasync

BfetchUserFromDB()

Cawait

Dthen

Attempts:

3 left

💡 Hint

Common Mistakes

Using then instead of await inside async functions.

Calling the function without await and expecting the resolved value.

The await keyword pauses the async function until the promise resolves, then returns the result.

3fill in blank

hard

Fix the error in the async function declaration.

Node.js

function [1] fetchData() {
  const response = await fetch('https://api.example.com');
  return response.json();
}

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

Aasync

Bawait

Casync function*

Dfunction*

Attempts:

3 left

💡 Hint

Common Mistakes

Placing await before the function keyword.

Using generator function syntax function* instead of async.

The async keyword must be placed before the function keyword to declare an async function. This allows use of await inside.

4fill in blank

hard

Fill both blanks to correctly handle errors with try/catch in async function.

Node.js

async function loadData() {
  try {
    const data = [1] fetchData();
    return data;
  } catch ([2]) {
    console.error('Error:', error);
  }
}

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

Aawait

Berr

Cerror

DfetchData

Attempts:

3 left

💡 Hint

Common Mistakes

Not using await inside try block.

Using a wrong variable name in catch parameter.

Use await to wait for the promise. The catch block catches errors with a parameter, commonly named error.

5fill in blank

hard

Fill all three blanks to create an async arrow function that fetches JSON data.

Node.js

const fetchJson = async () => {
  const response = await fetch([1]);
  const data = await response.[2]();
  return [3];
};

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

A'https://api.example.com/data'

Bjson

Cdata

Dtext

Attempts:

3 left

💡 Hint

Common Mistakes

Using text() instead of json() to parse response.

Returning the response object instead of parsed data.

The fetch function needs a URL string. The response object has a json() method to parse JSON. Finally, return the parsed data.

Practice

1. What does the await keyword do inside an async function in Node.js?

easy

A. It converts a promise into a callback function.

B. It makes the function run faster by skipping the promise.

C. It stops the entire program until the promise finishes.

D. It pauses the function execution until the promise resolves or rejects.

Solution

1. Step 1: Understand the role of await

   The await keyword pauses the execution of the async function until the promise it waits for settles (resolves or rejects).

2. Step 2: Differentiate from blocking behavior

   This pause only affects the async function, not the entire program, allowing other code to run concurrently.

3. Final Answer:

   It pauses the function execution until the promise resolves or rejects. -> Option D

4. Quick Check:

   await pauses async function = C [OK]

Hint: Remember: await pauses only async function, not whole program [OK]

Common Mistakes:

• Thinking await blocks the entire program
• Confusing await with callbacks
• Believing await speeds up code by skipping promises

2. Which of the following is the correct syntax to declare an async function in Node.js?

easy

A. function async myFunc() {}

B. async function myFunc() {}

C. function myFunc async() {}

D. async: function myFunc() {}

Solution

1. Step 1: Recall async function declaration syntax

   In Node.js, the correct way to declare an async function is by placing the async keyword before the function keyword.

2. Step 2: Check each option

   async function myFunc() {} matches the correct syntax: async function myFunc() {}. Others are invalid syntax.

3. Final Answer:

   async function myFunc() {} -> Option B

4. Quick Check:

   async before function keyword = B [OK]

Hint: Put async right before function keyword to declare async function [OK]

Common Mistakes:

• Placing async after function name
• Using colons or other symbols incorrectly
• Writing async inside parentheses

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

async function getNumber() {
  return 42;
}

async function main() {
  const result = await getNumber();
  console.log(result);
}

main();

medium

A. 42

B. Error: await used outside async function

C. undefined

D. Promise { 42 }

Solution

1. Step 1: Understand async function return values

   The function getNumber is async and returns 42, which means it returns a promise that resolves to 42.

2. Step 2: Await the promise in main

   The await keyword waits for the promise to resolve, so result gets the value 42, which is then logged.

3. Final Answer:

   42 -> Option A

4. Quick Check:

   await unwraps promise value = D [OK]

Hint: Await unwraps promise to get actual value inside async function [OK]

Common Mistakes:

• Expecting a Promise object printed
• Forgetting await causes Promise logged
• Using await outside async function

4. Identify the error in this code snippet:

async function fetchData() {
  const data = await fetch('https://api.example.com/data');
  return data.json();
}

fetchData().then(console.log);

medium

A. Missing await before data.json() call

B. fetch cannot be used in Node.js

C. async keyword is missing before fetchData

D. Cannot return data from async function

Solution

1. Step 1: Analyze the fetchData function

   The function awaits the fetch call, which returns a Response object. Calling data.json() returns a promise.

2. Step 2: Check promise handling for data.json()

   Since data.json() returns a promise, it should be awaited to get the parsed JSON before returning.

3. Final Answer:

   Missing await before data.json() call -> Option A

4. Quick Check:

   Await promises before returning parsed data = A [OK]

Hint: Await all promises inside async functions before returning [OK]

Common Mistakes:

• Not awaiting nested promises like data.json()
• Assuming fetch is unavailable in Node.js (modern Node supports it)
• Forgetting async keyword on async functions

5. You want to fetch user data and then fetch posts for that user sequentially using async/await. Which code snippet correctly handles errors and ensures posts are fetched only after user data is received?

async function getUserAndPosts() {
  try {
    const user = await fetchUser();
    const posts = await fetchPosts(user.id);
    return { user, posts };
  } catch (error) {
    console.error('Error fetching data:', error);
    return null;
  }
}

hard

A. fetchPosts runs before fetchUser completes

B. Does not handle errors because try/catch is missing

C. Correctly handles errors and fetches posts after user data

D. Returns posts without waiting for fetchPosts promise

Solution

1. Step 1: Check async/await sequence

   The code awaits fetchUser() first, then uses the user ID to await fetchPosts(), ensuring sequential execution.

2. Step 2: Verify error handling

   The try/catch block correctly catches any errors from either await call and logs them, returning null on failure.

3. Final Answer:

   Correctly handles errors and fetches posts after user data -> Option C

4. Quick Check:

   Try/catch with sequential await = A [OK]

Hint: Use try/catch around awaits to handle errors sequentially [OK]

Common Mistakes:

• Omitting try/catch for error handling
• Calling second await before first completes
• Returning promises without awaiting them