Callbacks in Javascript - Mini Project: Build & Apply

Understanding Callbacks in JavaScript

📖 Scenario: Imagine you are organizing a small event and you want to send invitations. You want to print a message after sending each invitation to confirm it was sent.

🎯 Goal: You will create a simple program that uses a callback function to print a confirmation message after sending each invitation.

📋 What You'll Learn

Create an array of guest names

Create a callback function that prints a confirmation message

Create a function that sends invitations and calls the callback after each send

Call the invitation function and display the confirmation messages

💡 Why This Matters

🌍 Real World

Callbacks are used in real life when you want to do something after a task finishes, like showing a message after a file downloads or a button is clicked.

💼 Career

Understanding callbacks is important for web developers to handle events, asynchronous tasks, and improve user experience.

1

Create the guest list

Create an array called guests with these exact names: 'Alice', 'Bob', 'Charlie'

Javascript

# Create an array called guests with 'Alice', 'Bob', and 'Charlie'
// Your code here

Need a hint?

Use square brackets [] to create an array and separate names with commas.

2

Create the callback function

Create a function called confirmSend that takes one parameter name and prints "Invitation sent to " followed by the name

Javascript

const guests = ['Alice', 'Bob', 'Charlie'];
// Create function confirmSend(name) that prints confirmation
// Your code here

Need a hint?

Use a function declaration and console.log with a template string to print the message.

3

Create the invitation sender function

Create a function called sendInvitations that takes two parameters: guestList and callback. Use a for loop with variable guest to go through guestList and call callback(guest) inside the loop.

Javascript

const guests = ['Alice', 'Bob', 'Charlie'];

function confirmSend(name) {
    console.log(`Invitation sent to ${name}`);
}

// Create function sendInvitations(guestList, callback) with a for loop
// Your code here

Need a hint?

Use a for...of loop to go through each guest and call the callback with the guest name.

4

Call the function and show output

Call the function sendInvitations with guests and confirmSend as arguments to print the confirmation messages.

Javascript

const guests = ['Alice', 'Bob', 'Charlie'];

function confirmSend(name) {
    console.log(`Invitation sent to ${name}`);
}

function sendInvitations(guestList, callback) {
    for (const guest of guestList) {
        callback(guest);
    }
}

// Call sendInvitations with guests and confirmSend
// Your code here

Need a hint?

Call sendInvitations(guests, confirmSend); to see the messages.