Lesson 1: Introduction to Control Flow

Learning Objectives

By the end of this lesson, learners will:

  • Understand what “control flow” means in programming
  • Know how JavaScript normally runs code
  • Learn why we need control structures like if, else, and switch
  • Prepare to write code that makes decisions and reacts to conditions

What Is Control Flow?

When you write a JavaScript program, the browser reads your code from top to bottom, left to right, one line at a time.
This is called the default control flow.

Example:

console.log("Line 1");
console.log("Line 2");
console.log("Line 3");

Output:

Line 1
Line 2
Line 3

But What If You Want the Code to Take Different Paths?

Real programs often need to make decisions, like:

  • Should a user see a “Welcome” message or a “Please log in” message?
  • Should you apply a discount if the user is a member?
  • Should you show “Good morning” or “Good evening”?

This is where control flow tools come in.


How Control Flow Works

JavaScript provides special keywords to change the flow of execution based on:

  • Conditions (if, else, else if)
  • Choices (switch)
  • Repeated actions (for, while — covered in the next module)

Control Flow = Decision Making

Without control flow:

console.log("Always runs");

With control flow:

if (userLoggedIn) {
  console.log("Welcome back!");
} else {
  console.log("Please log in.");
}

The Building Blocks of Control Flow

You’ll learn these in this module:

Keyword/StructurePurpose
ifCheck a condition and run code if it’s true
elseRun different code if the if condition is false
else ifAdd more specific conditions
switchCompare one value to many possible values
breakExit a switch block early
defaultRun fallback code in a switch block

Real-Life Analogy: Traffic Lights 🚦

Think of a traffic light:

  • If the light is green → Go
  • Else if the light is yellow → Slow down
  • Else (the light is red) → Stop

That’s exactly what we’ll be doing with JavaScript:

let light = "green";

if (light === "green") {
  console.log("Go");
} else if (light === "yellow") {
  console.log("Slow down");
} else {
  console.log("Stop");
}

Control Flow in Action: Example

let temperature = 32;

if (temperature < 0) {
  console.log("It's freezing!");
} else if (temperature < 30) {
  console.log("It's a nice day.");
} else {
  console.log("It's hot outside!");
}

🧠 This program:

  • Checks a value (temperature)
  • Makes a decision
  • Outputs different results depending on that value

Why Control Flow Is Essential

Without control flow, all your programs would do the exact same thing every time — no interaction, no customization, no intelligence.

Control flow lets your program:

  • React to user input
  • Validate data
  • Create dynamic content
  • Handle different situations in real time

Key Takeaways

  • Control flow is how JavaScript decides what code to run and when.
  • Without control flow, programs would be rigid and repetitive.
  • Tools like if, else, and switch help your program make decisions.