if, else, and blocks

Everything you have written so far runs from the top of the file to the bottom, one line after another, and it does the same thing every time. That is fine for a program with exactly one job. It is useless for a program that has to react: a ticket price that depends on age, a warning that only appears when a number is too high, a message that changes when someone leaves a box empty.

Think of a recipe that says: bake for thirty minutes; if the top is not brown yet, bake for five more. The recipe is still read top to bottom. But one instruction is fenced off behind a question, and whether you carry it out depends on what you see when you get there. JavaScript spells that fence 'if'.

That is the whole idea of this module. You are not learning a new kind of value or a new kind of maths. You are learning how to put a fence around some lines of code and a question on the gate.

The question on the gate is called a condition. It is not special syntax — it is an ordinary expression, of the kind you already write, that happens to produce a boolean. You met the comparison operators in the previous module: 'greater than' (>), 'less than' (<), 'greater than or equal' (>=), 'less than or equal' (<=), strict equality (===) and strict inequality (!==). Each one takes two values and produces true or false.

So 'age >= 18' is not a question hanging in the air. It is an expression with a value, the same way '2 + 2' is an expression with a value. If age is 21 then 'age >= 18' IS true, in exactly the sense that '2 + 2' IS 4.

One thing beginners expect and do not get: the condition is asked once, at the instant the program reaches that line, and then the program moves on. It is a snapshot, not a subscription. If the value changes a hundred lines later, nothing goes back and re-runs the branch. Nothing in this module watches anything.

An if statement is the keyword 'if', then a condition in round brackets, then the code to run in curly braces. The braces and everything between them are called a block, and the block runs either once or not at all — never twice, and never partly.

Read it out loud as a sentence and it stops looking like punctuation: 'if temperature is greater than thirty, then log this message'. The round brackets hold the question. The curly braces hold the answer.

Nothing else in the program changes. Lines above the if have already run. Lines below the if run afterwards either way. The if only controls what is inside its own braces.

An if on its own has two outcomes: the block runs, or nothing happens. Often you want the second case to do something too. That is 'else': a block with no condition of its own, which runs precisely when the if's condition was false. The else clause is optional, and there is at most one of them.

For three or more outcomes you chain them: 'else if'. This is worth saying plainly, because it looks like a keyword and is not one. 'else if' is simply an if statement written as the body of the else clause. That is why it needs its own condition in brackets, and why there is no limit on how many you chain.

The rule that follows from that is the one to remember: the branches are tested in the order you wrote them, the FIRST one whose condition is true runs, and the rest are not even evaluated. If a score of 95 matches the first branch, the program never asks whether 95 is also above 70. It already left.

This makes the order of your branches part of the logic, not a matter of taste. Put the narrowest, most specific condition first and the widest last, or the wide one will swallow the cases meant for the narrow one. Lesson six of this module is about nothing else.

The useful way to think about a block is: curly braces bundle any number of statements into a single statement, so that anywhere JavaScript expects one thing to happen, you can hand it a whole group.

This matters because the braces after an if are optional. If you leave them out, the if governs exactly ONE statement — the next one — and no more. Indentation has no meaning in JavaScript. A line that is lined up neatly under an if but sits outside its braces is not inside the if, it just looks that way. The third worked example below shows exactly this bug.

The advice from that: always write the braces, even for a one-line body. It costs two characters and it removes an entire category of bug — the one where you come back tomorrow, add a second line to the body, and silently break the program.

The exercises in this module ask you to make a decision about an input that changes — an age, a month name, a weight — and you cannot try many inputs if the value is fixed at the top of the file. So we borrow one idea from the next module, just enough to use it.

A function is a named recipe with a blank in it. You write 'function ticketPrice(age) {' then the body, then a closing brace. 'age' is the blank, called a parameter: a name for whatever value gets handed in. Inside the body you use it like any other value. When you reach 'return something;' the function stops immediately and hands that value back to whoever called it.

Calling it means writing the name with a value in brackets: 'ticketPrice(15)'. That runs the body with age set to 15 and produces whatever was returned, which you can log or store. Nothing about a function is running until it is called.

That is genuinely all you need here, and it is why 'return' shows up inside if branches throughout this module: returning from a branch both answers the question and ends the function, which is often clearer than assigning to a variable. Module 3 covers functions properly — defaults, arrows, scope, closures. Take this as a loan, not as the full story.

Writing 'if (ready = true)' when you meant 'if (ready === true)' is the classic first-week bug, and the cruel part is that it is not an error. It runs. A single = is assignment: it puts true into ready, throwing away whatever was there, and then the whole assignment expression produces the value that was just assigned. That value is true, so the block runs — and it will run every single time, no matter what ready was.

The same shape with a number is just as quiet: 'if (count = 0)' sets count to zero and produces 0, which is false-ish, so the block never runs and your variable has been wiped as a bonus.

The fix is mechanical. Comparisons use ===. If you ever find yourself typing = inside the round brackets of an if, stop and look again. And if a branch runs every time or never runs, this is the first thing to check.

A condition is an ordinary expression producing true or false, evaluated once when the program reaches it. 'if' runs a block only when its condition is true. 'else' covers the false case. 'else if' is an if inside the else clause, so branches are tested top to bottom and the first match wins. Braces bundle statements into one block, and without them an if governs only the next single statement. A single = in a condition assigns instead of comparing.