12.1 Introduction to Control Statements

Introduction to Control Statements (10 mins)

  • What Are Control Statements?

    • Control statements are a key part of programming that allow the flow of execution in a program to change based on certain conditions.

    • Instead of executing code line-by-line in sequence, control statements enable the program to make decisions, repeat certain actions, or choose between multiple paths of execution.

    • The most common control flow statements in JavaScript are conditional statements (like if-else and switch) and looping statements (like for, while).

  • Why Is Control Flow Important in Programming?

    • Decision Making: Without control flow, programs would execute sequentially and wouldn’t be able to respond to different conditions or inputs. For example, a shopping cart would not be able to decide when to apply discounts if there were no decision-making capabilities.

    • Dynamic Behavior: Control flow allows programs to behave differently based on input data, user actions, or other conditions, making them interactive and responsive.

    • Repetition: Control statements like loops help execute the same code multiple times without needing to write duplicate code, enhancing efficiency and making programs easier to maintain.

    Example:

    • Consider an online form where a user inputs their age. Using control flow, the program can verify if the user is eligible to access certain content:

      let age = 18;
if (age >= 18) {
  console.log("You are eligible to vote!");
} else {
  console.log("Sorry, you must be 18 or older to vote.");
}

  • Types of Control Statements:

    • Conditional Statements: if, if-else, switch

      • These allow the program to execute certain blocks of code only when specific conditions are met.

    • Looping Statements: for, while, do-while

      • These allow repeating a block of code multiple times, either for a fixed number of iterations or as long as a condition remains true.

    • Break and Continue: Used within loops to alter their execution.

    Key Concept:

    • Control flow is like providing a map for your program, telling it how to react under different circumstances and making sure it only does what is necessary at the right time.

Student Activity (10 mins):

Objective: Students will explore the concept of control flow by writing a simple script that uses an if-else statement to check conditions and execute different actions.

Instructions:

  1. Create an HTML file (e.g., control_flow.html) that includes a simple JavaScript script demonstrating control flow with an if-else statement.

    Example Code:

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Control Flow Example</title>
</head>
<body>
  <h1>Check the Console for Control Flow Output</h1>
  
  <script>
    // Define a variable for a user's age
    let age = 16;
    
    // Use control flow to check if the user is eligible to vote
    if (age >= 18) {
      console.log("You are eligible to vote.");
    } else {
      console.log("You are not eligible to vote.");
    }
  </script>
</body>
</html>

  2. Run the file in a browser:

    • Open the HTML file in a browser and check the console (F12 or right-click and "Inspect" > Console) to see the result.

    • Change the age variable in the script and observe how the output changes.

  3. Activity:

    • Modify the script to include more conditions using if-else if statements. For example, you can create a script that checks:

      • If the user is a teenager (13–19 years old).

      • If the user is an adult (20+).

      • If the user is a child (below 13).

    Example:

    let age = 15;

if (age < 13) {
  console.log("You are a child.");
} else if (age >= 13 && age <= 19) {
  console.log("You are a teenager.");
} else {
  console.log("You are an adult.");
}

Follow-up Questions:

  1. Why is control flow essential in programs that interact with users or process inputs?

  2. What happens if there is no control flow in a program with dynamic conditions?

  3. Can you think of real-world examples where control flow would be critical (e.g., logging into a website or filling out a form)?

Expected Outcome:

Students will understand the importance of control flow in programming, including how to use if-else statements to make decisions in a script. They will also see how changing variables affects the output and how control flow makes their code dynamic and flexible.

PreviousLecture_12_Control Flow and StatementsNext12.2 If Statements and If-Else

Last updated