Full Stack Camp

Week 3 Day 4 JavaScript Lesson:

🎉 Hey wonderful campers!

Welcome to Week 3, Day 4 of our exciting JavaScript journey! 🌍✨
We’re now stepping deeper into the world of interactivity and logic—where our code starts talking to users and making decisions repeatedly. 😮
So, buckle up, get comfy, and let’s learn some real coding superpowers today! 🚀💻

🧾 Today’s Lesson Outline:
✅ 1. alert() – Show Messages to the User
✅ 2. What is a Loop? Why do We Need It?
✅ 3. while Loop
✅ 4. do...while Loop
✅ 5. break and continue
✅ 6. Combining Loops with if Statements

🗨️ 1. alert() — Pop-up Messages 💬

🔹 What is alert()?
alert() is a built-in JavaScript function that shows a pop-up box with a message. It’s a simple way to talk to the user.

alert("Hello, Campers! Welcome to JavaScript!");

🧠 Analogy:
Imagine knocking on someone’s door and shouting something through the window — you don’t wait for an answer, just say it and leave. That’s alert()! 💬🚪

🧪 More Examples:

let name = "Kebede"; alert("Hi " + name + ", welcome to the camp! 😎");
let score = 95; alert("Your score is: " + score);

You can use alert() to show results to users like:
➤➤Converted temperatures 🌡️
➤➤Final grades 📝
➤➤Confirmation messages ✅

🔁 2. What is a Loop? Why Do We Need It?

Sometimes we need to do the same task many times.
🧠 Analogy:
Imagine you want to clap your hands 10 times 👏. You could write:
console.log("Clap!"); console.log("Clap!"); console.log("Clap!"); ...

But that’s tiring and repetitive. Instead, we use a loop!
A loop is like saying:

"As long as this condition is true, keep repeating this code."

🔄 3. while Loop – Repeat While a Condition is True

🧾 Syntax:

while (condition) { // code to run }

💡 Example:

let count = 1; while (count <= 5) { console.log("Count is: " + count); count++; }

🧠 Explanation:
The loop starts with count = 1.
It checks count <= 5 — if true, it runs the block.
count++ increases count by 1.
When count becomes 6, the condition is false, and the loop stops.

🚨 Infinite Loop Warning!
If you forget to change the condition, it will run forever!

let i = 1; while (i <= 5) { console.log("This will never stop 😨"); // missing i++ }

✨ Real-Life Example:

let bottles = 3; while (bottles > 0) { alert("Drink a bottle. " + bottles + " left."); bottles--; }

🔁 4. do...while Loop — Run First, Then Check

🔹 Syntax:
do { // code to run } while (condition);

💡 Example:

let x = 1; do { console.log("x is: " + x); x++; } while (x <= 3);

📌 Difference from while:
do...while runs the code at least once, even if the condition is false!

let y = 10; do { console.log("This runs once even if y > 5"); } while (y < 5);

🧨 5. break and continue in Loops

✅ break — Stop the loop early

let num = 1; while (num <= 10) { if (num === 5) { break; // stops when num is 5 } console.log("Number: " + num); num++; }

🧠 Use break when you want to escape a loop.

✅ continue — Skip one round, continue with the rest

let n = 0; while (n < 5) { n++; if (n === 3) { continue; // skips 3 } console.log(n); // prints 1, 2, 4, 5 }

📌 Use continue to skip a step inside the loop.

🔗 6. Using if Inside Loops 💡

You can combine loops and conditions!
💡 Example 1: Print even numbers only

let i = 1; while (i <= 10) { if (i % 2 === 0) { console.log(i + " is even"); } i++; }

💡 Example 2: Countdown with alert

let seconds = 5; while (seconds > 0) { alert("⏳ Time left: " + seconds + " seconds"); seconds--; } alert("⏰ Time's up!");

🧠 Summary for Today
You learned how to:
✅Use alert() to communicate with the user
✅Create loops with while and do...while
✅Break out or skip parts of a loop with break and continue
✅Combine loops with conditions to write smart, repeating code

97 views12:22