Lesson 2: Control Flow, Conditionals & Loops

Control flow statements allow your code to make logical decisions based on Boolean expressions.

if / else if / else: Evaluates conditional blocks sequentially.

Ternary Operator (condition ? exprIfTrue : exprIfFalse): Concise inline conditional assignments.

Switch Statement: Evaluates multiple discrete match cases against an expression.

⊞HTML5 Web Code (index.html)

<!DOCTYPE html>

<head>

<title>JS Control Flow</title>

</head>

<h2>JavaScript Loops & Decisions</h2>

const marks = 85;

let grade = "";

if (marks >= 90) {

grade = "A+ (Outstanding)";

} else if (marks >= 75) {

grade = "A (Excellent)";

} else {

grade = "B (Good)";

}

const listElement = document.getElementById("number-list");

// Standard for loop

for (let i = 1; i <= 5; i++) {

const li = document.createElement("li");

li.style.padding = "6px 12px";

li.style.margin = "4px 0";

li.style.backgroundColor = "#1f2029";

li.style.borderLeft = "3px solid #04AA6D";

li.textContent = "Step #" + i + " - Grade: " + grade;

listElement.appendChild(li);

}

</script>

</body>

</html>

for (let i = 0; i < n; i++): Index-based counter loop.

while (condition): Loops continuously while a condition remains true.

for...of: Iterates cleanly over array elements.

for...in: Iterates over object keys.