Lesson 2: Functions and Control Flow

So far your code runs top to bottom, once, and stops. Real programs make decisions and repeat actions. This lesson covers the two things that turn a script into actual logic: functions (reusable blocks of code) and control flow (decisions and loops).

Functions: packaging code you'll reuse

function greet(name) {
  return "Hello, " + name + "!";
}

console.log(greet("Alex")); // "Hello, Alex!"
console.log(greet("Sam"));  // "Hello, Sam!"

A function is a labeled block of code you can run whenever you need it, with different inputs each time. name here is a parameter — a placeholder for whatever value you pass in when you call the function. return sends a value back out.

Arrow functions: the modern shorthand

// same function, written as an arrow function
const greet = (name) => {
  return "Hello, " + name + "!";
};

// even shorter, for a single return statement
const greet = (name) => "Hello, " + name + "!";

You'll see both styles constantly in real code. Arrow functions are the more common style in modern JavaScript, especially for short functions.

if / else: making decisions

const age = 20;

if (age >= 18) {
  console.log("You can vote.");
} else {
  console.log("Not yet.");
}

The code inside { } after if only runs if the condition is true. The else block is the fallback for everything else.

else if: checking multiple conditions

const score = 85;

if (score >= 90) {
  console.log("A");
} else if (score >= 80) {
  console.log("B");
} else if (score >= 70) {
  console.log("C");
} else {
  console.log("Needs improvement");
}

JavaScript checks each condition top to bottom and stops at the first one that's true — so order matters. This example correctly prints "B".

Comparison and logical operators

Operator	Meaning
`>` `<` `>=` `<=`	Greater than, less than, and their "or equal to" versions
`===` `!==`	Equal to / not equal to (always use these, not `==`)
`&&`	AND — both sides must be true
`\|\|`	OR — at least one side must be true

const hasTicket = true;
const age = 15;

if (hasTicket && age >= 13) {
  console.log("Welcome in!");
}

Loops: repeating actions

for (let i = 0; i < 5; i++) {
  console.log("Count: " + i);
}
// prints Count: 0 through Count: 4

A for loop has three parts: where to start (let i = 0), when to stop (i < 5), and what happens after each round (i++, which adds 1). This is the most common loop for "do this a specific number of times."

common mistake

Forgetting to update the loop variable (leaving out i++) creates an infinite loop that freezes your page. If your browser tab suddenly locks up while testing a loop, this is almost always why.

Try it yourself

exercise

Write a function called checkAge(age) that returns "child" if under 13, "teen" if 13-17, and "adult" for 18 and up, using if/else if/else. Test it by calling it with three different ages and logging each result.

Level up: a counting loop

exercise 2

Write a for loop that logs every even number from 0 to 20. Hint: you can check if a number is even with number % 2 === 0 (the % gives you the remainder after division).

✓ quick check — 3 questions

1. What does a function's return statement do?

Prints the value to the console Sends a value back out to wherever the function was called Deletes the function

2. In a for loop, what does forgetting to update the loop variable cause?

A syntax error The loop runs once and stops An infinite loop that can freeze the page

3. What does && require to be true?

Both conditions on either side Only one condition, either side Neither condition

what's next

Lesson 3 covers arrays and objects — how to store and work with real collections of data, instead of one value at a time.

bottom line

Functions package reusable logic. if/else makes decisions, and loops repeat actions without copy-pasting code. Together, these are what turn a script into a program that actually reacts to different situations.