Callback pattern and callback hell in Node.js - Mini Project: Build & Apply

Understanding Callback Pattern and Callback Hell in Node.js

📖 Scenario: You are building a simple Node.js program that simulates fetching user data, then fetching the user's posts, and finally fetching comments on those posts. Each step uses a callback function to handle the asynchronous operation.This project will help you understand how callbacks work and how nested callbacks can lead to callback hell.

🎯 Goal: Create a series of nested callback functions to simulate asynchronous data fetching in Node.js. You will write code that first fetches a user, then fetches posts for that user, and finally fetches comments for those posts, all using callbacks.

📋 What You'll Learn

Create a function called getUser that takes a userId and a callback, then calls the callback with user data.

Create a function called getPosts that takes a userId and a callback, then calls the callback with posts data.

Create a function called getComments that takes a postId and a callback, then calls the callback with comments data.

Use nested callbacks to fetch user, then posts, then comments in sequence.

Observe the nested structure that leads to callback hell.

💡 Why This Matters

🌍 Real World

Many Node.js applications use callbacks to handle asynchronous operations like reading files, making network requests, or querying databases.

💼 Career

Understanding callbacks and callback hell is essential for Node.js developers to write clean, maintainable asynchronous code and to transition to modern async patterns.

1

Create the getUser function

Write a function called getUser that takes two parameters: userId and callback. Inside the function, simulate an asynchronous operation using setTimeout that after 100ms calls the callback with an object { id: userId, name: 'Alice' }.

Node.js

# Your code here
// Define getUser function with userId and callback parameters
// Use setTimeout to simulate async call
// After 100ms, call callback with user object { id: userId, name: 'Alice' }

Hint

Use setTimeout to simulate delay. Call callback inside the timeout with the user object.

2

Create the getPosts function

Add a function called getPosts that takes userId and callback as parameters. Use setTimeout to simulate an async call that after 100ms calls callback with an array of posts: [{ id: 1, title: 'Post 1' }, { id: 2, title: 'Post 2' }].

Node.js

function getUser(userId, callback) {
  setTimeout(() => {
    callback({ id: userId, name: 'Alice' });
  }, 100);
}

// Your code here
// Define getPosts function with userId and callback
// Use setTimeout to simulate async call
// After 100ms, call callback with posts array [{ id: 1, title: 'Post 1' }, { id: 2, title: 'Post 2' }]

Hint

Similar to getUser, use setTimeout and call callback with the posts array.

3

Create the getComments function

Add a function called getComments that takes postId and callback as parameters. Use setTimeout to simulate an async call that after 100ms calls callback with an array of comments: [{ id: 101, text: 'Great post!' }, { id: 102, text: 'Thanks for sharing' }].

Node.js

function getUser(userId, callback) {
  setTimeout(() => {
    callback({ id: userId, name: 'Alice' });
  }, 100);
}

function getPosts(userId, callback) {
  setTimeout(() => {
    callback([{ id: 1, title: 'Post 1' }, { id: 2, title: 'Post 2' }]);
  }, 100);
}

// Your code here
// Define getComments function with postId and callback
// Use setTimeout to simulate async call
// After 100ms, call callback with comments array [{ id: 101, text: 'Great post!' }, { id: 102, text: 'Thanks for sharing' }]

Hint

Follow the same pattern as previous functions. Use setTimeout and call callback with the comments array.

4

Use nested callbacks to fetch user, posts, and comments

Write code that calls getUser with userId 1 and a callback that receives the user. Inside that callback, call getPosts with the user's id and a callback that receives posts. Inside that callback, call getComments with the first post's id and a callback that receives comments. This nesting shows callback hell.

Node.js

function getUser(userId, callback) {
  setTimeout(() => {
    callback({ id: userId, name: 'Alice' });
  }, 100);
}

function getPosts(userId, callback) {
  setTimeout(() => {
    callback([{ id: 1, title: 'Post 1' }, { id: 2, title: 'Post 2' }]);
  }, 100);
}

function getComments(postId, callback) {
  setTimeout(() => {
    callback([{ id: 101, text: 'Great post!' }, { id: 102, text: 'Thanks for sharing' }]);
  }, 100);
}

// Your code here
// Call getUser with userId 1 and a callback
// Inside that callback, call getPosts with user.id and a callback
// Inside that callback, call getComments with first post id and a callback

Hint

Each callback is nested inside the previous one to show how callbacks can become deeply nested.

Practice

1. What is the main purpose of a callback function in Node.js?

easy

A. To run code after an asynchronous action finishes

B. To stop the program execution immediately

C. To create a new thread for parallel processing

D. To convert synchronous code into asynchronous code automatically

Solution

1. Step 1: Understand asynchronous actions in Node.js

   Node.js uses callbacks to handle tasks that take time, like reading files or fetching data, without stopping the program.

2. Step 2: Identify the role of the callback

   The callback function runs after the task finishes, allowing the program to continue smoothly.

3. Final Answer:

   To run code after an asynchronous action finishes -> Option A

4. Quick Check:

   Callback = run after async task [OK]

Hint: Callbacks run code after tasks finish [OK]

Common Mistakes:

• Thinking callbacks stop program execution
• Confusing callbacks with threads
• Assuming callbacks convert sync to async automatically

2. Which of the following is the correct function declaration syntax to define a callback function in Node.js?

easy

A. function callback { console.log('Done'); }

B. callback => { console.log('Done'); }

C. function callback() { console.log('Done'); }

D. callback() => { console.log('Done'); }

Solution

1. Step 1: Review function declaration syntax

   In JavaScript, a function is declared with the keyword 'function' followed by parentheses and curly braces.

2. Step 2: Check each option for syntax correctness

   function callback() { console.log('Done'); } uses correct syntax. callback => { console.log('Done'); } is an arrow function expression, not a function declaration. function callback { console.log('Done'); } misses parentheses after function name. callback() => { console.log('Done'); } mixes arrow function and parentheses incorrectly.

3. Final Answer:

   function callback() { console.log('Done'); } -> Option C

4. Quick Check:

   Correct function syntax = function callback() { console.log('Done'); } [OK]

Hint: Function syntax: function name() { } [OK]

Common Mistakes:

• Omitting parentheses in function declaration
• Mixing arrow function syntax incorrectly
• Missing curly braces for function body

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

function first(callback) {
  setTimeout(() => {
    console.log('First');
    callback();
  }, 100);
}

function second() {
  console.log('Second');
}

first(second);

medium

A. First\nSecond

B. Second\nFirst

C. First

D. Second

Solution

1. Step 1: Understand setTimeout behavior

   setTimeout delays the function inside it by 100 milliseconds, then runs the callback.

2. Step 2: Trace the code execution order

   first() calls setTimeout, which waits 100ms, then logs 'First' and calls second(). So 'First' prints first, then 'Second'.

3. Final Answer:

   First\nSecond -> Option A

4. Quick Check:

   Callback runs after delay = 'First' then 'Second' [OK]

Hint: setTimeout delays code, callback runs after delay [OK]

Common Mistakes:

• Assuming callback runs immediately
• Confusing order of console logs
• Ignoring asynchronous delay

4. Identify the problem in this nested callback code and how to fix it:

readFile('file1.txt', function(err, data1) {
  if (err) throw err;
  readFile('file2.txt', function(err, data2) {
    if (err) throw err;
    readFile('file3.txt', function(err, data3) {
      if (err) throw err;
      console.log(data1, data2, data3);
    });
  });
});

medium

A. Use synchronous readFileSync to avoid callbacks

B. This is callback hell; fix by using Promises or async/await

C. Syntax error: missing semicolons after callbacks

D. No problem; this is the best way to read files sequentially

Solution

1. Step 1: Recognize nested callbacks cause callback hell

   Multiple nested callbacks make code hard to read and maintain, known as callback hell.

2. Step 2: Suggest modern alternatives

   Using Promises or async/await flattens the code, making it cleaner and easier to follow.

3. Final Answer:

   This is callback hell; fix by using Promises or async/await -> Option B

4. Quick Check:

   Nested callbacks = callback hell, use Promises [OK]

Hint: Nested callbacks = callback hell; use Promises [OK]

Common Mistakes:

• Ignoring readability problems
• Thinking semicolons fix callback hell
• Using synchronous calls in async code

5. You have three asynchronous tasks that depend on each other in sequence. Which approach best avoids callback hell while keeping the tasks in order?

hard

A. Use nested callbacks for each task

B. Use setTimeout to delay each task manually

C. Run all tasks in parallel without waiting

D. Use Promises chaining or async/await syntax

Solution

1. Step 1: Understand the problem of callback hell

   Nested callbacks make code messy and hard to maintain when tasks depend on each other.

2. Step 2: Identify better patterns for sequencing async tasks

   Promises chaining or async/await syntax keep code flat and readable while preserving order.

3. Final Answer:

   Use Promises chaining or async/await syntax -> Option D

4. Quick Check:

   Promises/async await = clean sequential async code [OK]

Hint: Use Promises or async/await for clean async flow [OK]

Common Mistakes:

• Using nested callbacks causing callback hell
• Running tasks in parallel when order matters
• Using setTimeout for sequencing tasks