Foundations

Conditionals

An if statement lets JavaScript choose between branches.

if statement An `if` statement runs one block when its condition is true and can use `else` for the other case.

Conditionals

temperature
conditionals.js
Replay: real traced execution (multi-file project)
const temperature = 72;
let status = "";

if (temperature >= 80) {
  status = "warm";
} else {
  status = "comfortable";
}

console.log("temperature=" + temperature);
console.log("status=" + status);

const temperature = 55;
let status = "";

if (temperature >= 80) {
  status = "warm";
} else {
  status = "comfortable";
}

console.log("temperature=" + temperature);
console.log("status=" + status);

const temperature = 90;
let status = "";

if (temperature >= 80) {
  status = "warm";
} else {
  status = "comfortable";
}

console.log("temperature=" + temperature);
console.log("status=" + status);

  1. temperature ← 72, status ← (empty)

    1const temperature→ 72 = 72; //@temperature=55, 902let status→ (empty) = "";

  2. console.log("temperature=" + temperature);

    7  status = "comfortable";8}910console.log("temperature=" + temperature72);11console.log("status=" + statuscomfortable);
    outputtemperature=72
status=comfortable

  1. temperature ← 55, status ← (empty)

    1const temperature→ 55 = 55;2let status→ (empty) = "";

  2. console.log("temperature=" + temperature);

    7  status = "comfortable";8}910console.log("temperature=" + temperature55);11console.log("status=" + statuscomfortable);
    outputtemperature=55
status=comfortable

  1. temperature ← 90, status ← (empty)

    1const temperature→ 90 = 90;2let status→ (empty) = "";

  2. if (temperature >= 80)

    1const temperature = 90;2let status = "";34if (temperature90 >= 80) {5  status = "warm";6} else {

  3. console.log("temperature=" + temperature);

    7  status = "comfortable";8}910console.log("temperature=" + temperature90);11console.log("status=" + statuswarm);
    outputtemperature=90
status=warm

Follow the Branch

  1. temperature starts at 72.
  2. status starts as an empty string.
  3. JavaScript checks whether temperature >= 80.
  4. 72 is below 80, so the else branch sets status to comfortable.
  5. The program prints temperature=72 and status=comfortable. | temperature | check | status | | --- | --- | --- | | 55 | 55 >= 80 is false | comfortable | | 72 | 72 >= 80 is false | comfortable | | 90 | 90 >= 80 is true | warm |

Exercise: conditionals.js

Reproduce status=comfortable for temperature 72, then try 55 and 90 and predict the branch result.