Skip to main content

Chapter 2 - if-else and Flow Control (JavaScript)

Here's a JavaScript-flavoured version of the same concepts, with small JS examples for each idea.

Boolean values​

JavaScript has two Boolean values: true and false (lowercase, unlike Python's True/False).

let spam = true;
let eggs = false;
console.log(typeof spam);  // 'boolean'

Comparison operators​

Comparison operators evaluate to true or false. Use === (strict equality) and !== instead of == and !=.

42 === 42     // true
42 !== 99     // true
42 < 100      // true
42 > 100      // false
42 <= 42      // true
42 >= 43      // false

=== checks both value and type, while == does type coercion (avoid it):

42 == "42"    // true  (type coercion -- avoid)
42 === "42"   // false (strict -- use this)

The difference between === and =​

=== is the comparison operator (checks if two values are equal). = is the assignment operator (stores a value in a variable). They are not interchangeable.

let spam = 42;     // assignment: store 42 in spam
spam === 42;       // comparison: is spam equal to 42? (true)

JavaScript also has == (loose equality), but prefer === to avoid type coercion surprises.

Boolean operators: &&, ||, !​

&& is AND, || is OR, ! is NOT.

true && true    // true
true && false   // false
true || false   // true
false || false  // false
!true           // false
!false          // true

Mixing Boolean and comparison operators​

You can combine comparison operators with Boolean operators for complex conditions.

const age = 25;
const hasId = true;
if (age >= 18 && hasId) {
  console.log("Entry allowed");
}

const temperature = 72;
if (temperature < 60 || temperature > 90) {
  console.log("Stay inside");
}

Conditions​

A condition is just an expression that evaluates to true or false. Conditions are used in flow control statements to decide which code to run.

const name = "Alice";
name === "Alice";   // This is a condition — evaluates to true

JavaScript also has "truthy" and "falsy" values: 0, "", null, undefined, and NaN are all falsy.

Blocks of code​

A block of code is a group of statements inside curly braces {}. JavaScript uses braces (not indentation like Python) to define blocks.

if (name === "Alice") {
  console.log("Hi, Alice!");       // start of block
  console.log("How are you?");    // still in the block
  if (age > 18) {
    console.log("You are an adult.");  // nested block
  }
}
console.log("Done");              // outside all blocks

Program execution​

By default, JavaScript executes code from top to bottom, one line at a time. Flow control statements can cause the execution to skip or jump to different blocks instead of just going straight down.

if statements​

An if statement runs a block of code only when the condition is true. Note the parentheses around the condition.

const name = "Alice";
if (name === "Alice") {
  console.log("Hi, Alice!");
}

else statements​

An else runs when the if condition is false.

const password = "fish";
if (password === "swordfish") {
  console.log("Access granted");
} else {
  console.log("Wrong password");
}

else if statements​

else if (JavaScript's equivalent of Python's elif) lets you check multiple conditions in order. Only the first matching branch runs.

const age = 12;
if (age < 5) {
  console.log("Free entry");
} else if (age < 13) {
  console.log("Child ticket");
} else if (age < 65) {
  console.log("Adult ticket");
} else {
  console.log("Senior ticket");
}

Order matters: because conditions are checked top to bottom, the first true condition wins. If you put age < 65 before age < 13, a 12-year-old would get "Adult ticket" instead of "Child ticket".

Adding a final else​

A final else after your else if chain guarantees that at least one block will always run, even if none of the conditions are true.

const name = "Bob";
const age = 30;
if (name === "Alice") {
  console.log("Hi, Alice.");
} else if (age < 12) {
  console.log("You are not Alice, kiddo.");
} else {
  console.log("You are neither Alice nor a little kid.");
}

A short program: Opposite Day​

This example uses a Boolean variable to flip the logic of an if/else statement.

const name = prompt("Enter your name:");
const isOppositeDay = true;

if (isOppositeDay) {
  if (name !== "Alice") {
    console.log("Hello, Alice!");
  } else {
    console.log("I don't know you.");
  }
} else {
  if (name === "Alice") {
    console.log("Hello, Alice!");
  } else {
    console.log("I don't know you.");
  }
}

A short program: Dishonest Capacity Calculator​

This example uses Boolean operators with user input and conditional logic to check venue capacity honestly (or dishonestly).

const capacity = 30;
const guests = Number(prompt("How many guests?"));
const bribe = prompt("Has the inspector been bribed? (yes/no)");

if (guests <= capacity) {
  console.log("You're within capacity.");
} else if (bribe === "yes") {
  console.log("We'll look the other way.");
} else {
  console.log("You are over capacity! Shut it down!");
}

Overall idea of the chapter​

The chapter's main message is: flow control lets your program make decisions using if, else if, and else, powered by Boolean values and comparison/Boolean operators. The concepts are identical to Python, but JavaScript uses {} for blocks, () around conditions, ===/!== for comparison, and &&/||/! for Boolean operators.