Activity 1.7: Console Input

Activity 1.7

Console Input

Key Concepts

prompt()

alert()

Getting Input

prompt() asks the user a question and gives back whatever they type as a string.

let name = prompt("Enter your name:");
console.log(`Hello ${name}!`);

Pausing with alert()

When a program runs several demos back to back,alert() pauses execution until the user presses enter — giving them a chance to read the output before it moves on.

console.log("Section 1");
alert("Press enter to continue");
console.log("Section 2");

Today's Objectives

Gathering input from the user with prompt()
Interpolating that input into output
Pausing between demos with alert()

Key Terms

prompt(): Asks the user a question and returns what they typed, as a string.
alert(): Pauses the program until the user presses enter.

'F' → Fullscreen

Build

Create a new JavaScript file named 1-7-console-input.js.

Task 1: Simple To-Do List

Ask the user for three tasks.
Print them back as a numbered list.

1
console.log("--- Demo 1 - Simple To-Do List ---");
2
console.log("Let's add a few tasks to your list.");
3

4
let task1 = prompt("Task 1:");
5
let task2 = prompt("Task 2:");
6
let task3 = prompt("Task 3:");
7

8
console.log();
9
console.log("Your To-Do List:");
10
console.log(`1. ${task1}`);
11
console.log(`2. ${task2}`);
12
console.log(`3. ${task3}`);
13
alert("Press enter to continue...");

Task 2: User Profile Setup

Ask the user for a username, favorite subject, and after-school activity.
Print a short profile summary.

1
console.log("--- Demo 1 - Simple To-Do List ---");
2
console.log("Let's add a few tasks to your list.");
3

4
let task1 = prompt("Task 1:");
5
let task2 = prompt("Task 2:");
6
let task3 = prompt("Task 3:");
7

8
console.log();
9
console.log("Your To-Do List:");
10
console.log(`1. ${task1}`);
11
console.log(`2. ${task2}`);
12
console.log(`3. ${task3}`);
13
alert("Press enter to continue...");
14

15
console.log("--- Demo 2 - User Profile Setup ---");
16
console.log("WELCOME! LET'S SET UP YOUR PROFILE...");
17

18
let username = prompt("Enter your username:");
19
let subject = prompt("What's your favorite subject in school?");
20

21
console.log("Choose your preferred after-school activity:");
22
console.log("- Sports");
23
console.log("- Music");
24
console.log("- Gaming");
25
console.log("- Volunteering");
26
let activity = prompt("->");
27

28
console.log();
29
console.log("- Creating your profile -");
30
console.log(`NAME: ${username}`);
31
console.log(`FAVORITE SUBJECT: ${subject}`);
32
console.log(`AFTER-SCHOOL ACTIVITY: ${activity}`);
33
alert("Press enter to continue...");

Task 3: Simple Survey

Ask the user three survey questions.
Print the results.

1
console.log("--- Demo 1 - Simple To-Do List ---");
2
console.log("Let's add a few tasks to your list.");
3

4
let task1 = prompt("Task 1:");
5
let task2 = prompt("Task 2:");
6
let task3 = prompt("Task 3:");
7

8
console.log();
9
console.log("Your To-Do List:");
10
console.log(`1. ${task1}`);
11
console.log(`2. ${task2}`);
12
console.log(`3. ${task3}`);
13
alert("Press enter to continue...");
14

15
console.log("--- Demo 2 - User Profile Setup ---");
16
console.log("WELCOME! LET'S SET UP YOUR PROFILE...");
17

18
let username = prompt("Enter your username:");
19
let subject = prompt("What's your favorite subject in school?");
20

21
console.log("Choose your preferred after-school activity:");
22
console.log("- Sports");
23
console.log("- Music");
24
console.log("- Gaming");
25
console.log("- Volunteering");
26
let activity = prompt("->");
27

28
console.log();
29
console.log("- Creating your profile -");
30
console.log(`NAME: ${username}`);
31
console.log(`FAVORITE SUBJECT: ${subject}`);
32
console.log(`AFTER-SCHOOL ACTIVITY: ${activity}`);
33
alert("Press enter to continue...");
34

35
console.log("--- Demo 3 - Simple Survey ---");
36
console.log("We'd love to get your feedback!");
37

38
let favoriteColor = prompt("What is your favorite color?");
39
let favoriteFood = prompt("What is your favorite food?");
40
let travelDestination = prompt("Where is a place you would like to travel?");
41

42
console.log();
43
console.log("- Survey Results -");
44
console.log(`Favorite Color: ${favoriteColor}`);
45
console.log(`Favorite Food: ${favoriteFood}`);
46
console.log(`Travel Destination: ${travelDestination}`);
47
alert("Press enter to continue...");

Task 4: Fantasy Story Builder

Ask the user for a main character, a magical creature, and a magical place.
Interpolate their answers into a short story.

1
console.log("--- Demo 1 - Simple To-Do List ---");
2
console.log("Let's add a few tasks to your list.");
3

4
let task1 = prompt("Task 1:");
5
let task2 = prompt("Task 2:");
6
let task3 = prompt("Task 3:");
7

8
console.log();
9
console.log("Your To-Do List:");
10
console.log(`1. ${task1}`);
11
console.log(`2. ${task2}`);
12
console.log(`3. ${task3}`);
13
alert("Press enter to continue...");
14

15
console.log("--- Demo 2 - User Profile Setup ---");
16
console.log("WELCOME! LET'S SET UP YOUR PROFILE...");
17

18
let username = prompt("Enter your username:");
19
let subject = prompt("What's your favorite subject in school?");
20

21
console.log("Choose your preferred after-school activity:");
22
console.log("- Sports");
23
console.log("- Music");
24
console.log("- Gaming");
25
console.log("- Volunteering");
26
let activity = prompt("->");
27

28
console.log();
29
console.log("- Creating your profile -");
30
console.log(`NAME: ${username}`);
31
console.log(`FAVORITE SUBJECT: ${subject}`);
32
console.log(`AFTER-SCHOOL ACTIVITY: ${activity}`);
33
alert("Press enter to continue...");
34

35
console.log("--- Demo 3 - Simple Survey ---");
36
console.log("We'd love to get your feedback!");
37

38
let favoriteColor = prompt("What is your favorite color?");
39
let favoriteFood = prompt("What is your favorite food?");
40
let travelDestination = prompt("Where is a place you would like to travel?");
41

42
console.log();
43
console.log("- Survey Results -");
44
console.log(`Favorite Color: ${favoriteColor}`);
45
console.log(`Favorite Food: ${favoriteFood}`);
46
console.log(`Travel Destination: ${travelDestination}`);
47
alert("Press enter to continue...");
48

49
console.log("--- Demo 4 - Fantasy Story Builder ---");
50
console.log("Let's create a fantasy story!");
51

52
let mainCharacter = prompt("Name your main character:");
53
let magicalCreature = prompt("Name a magical creature:");
54
let aMagicalPlace = prompt("Name a magical place:");
55

56
console.log();
57
console.log("- Your Story -");
58
console.log(`Once upon a time, there was a hero named ${mainCharacter}.`);
59
console.log(`${mainCharacter} traveled to the ${aMagicalPlace} to seek the legendary ${magicalCreature}.`);
60
console.log("Their quest was just beginning...");

Checkpoint

Verify your program works correctly.

--- Demo 1 - Simple To-Do List ---
Let's add a few tasks to your list.
Task 1: Do Homework
Task 2: Cook Dinner
Task 3: Clean Bedroom

Your To-Do List:
1. Do Homework
2. Cook Dinner
3. Clean Bedroom
Press enter to continue... [Enter]

--- Demo 2 - User Profile Setup ---
WELCOME! LET'S SET UP YOUR PROFILE...
Enter your username: amortimer
What's your favorite subject in school? Computer Science
Choose your preferred after-school activity:
- Sports
- Music
- Gaming
- Volunteering
-> Gaming

- Creating your profile -
NAME: amortimer
FAVORITE SUBJECT: Computer Science
AFTER-SCHOOL ACTIVITY: Gaming
Press enter to continue... [Enter]

--- Demo 3 - Simple Survey ---
We'd love to get your feedback!
What is your favorite color? purple
What is your favorite food? pizza
Where is a place you would like to travel? Japan

- Survey Results -
Favorite Color: purple
Favorite Food: pizza
Travel Destination: Japan
Press enter to continue... [Enter]

--- Demo 4 - Fantasy Story Builder ---
Let's create a fantasy story!
Name your main character: Ada
Name a magical creature: Griffin
Name a magical place: Cleveland

- Your Story -
Once upon a time, there was a hero named Ada.
Ada traveled to the Cleveland to seek the legendary Griffin.
Their quest was just beginning...

Reflection

Answer the following questions before submitting your work.

What does prompt() give back to your program — and what type of value is it, always?
Why does this program use alert() between demos instead of just letting all four run back to back?
Pick one of the four demos. What's one other question you could add to make it more interesting?

Submit

Submit the required files to the appropriate dropbox.