<font color=#94c4ff> Nested Conditionals Code Example in Javascript </font>

if (condition1) { // Actions to run for condition 1 // CODE BLOCK A

if (condition2) {
    // Actions to run for condition 2
    // CODE BLOCK B
} else {
    // Actions to run if condition 2 is not met
    // CODE BLOCK C
} } else {
// Actions to run if condition 1 was never met
// CODE BLOCK D }

This code states that

  • If condition 1 AND condition 2 are met, run code blocks A and B
  • If condition 1 is met but condition 2 IS NOT met, run code blocks A and C
  • If condition 1 was never met, run code block D

<font color=#94c4ff> Example 1 - Basic </font>

  1. Write a code that uses information about the weather, boots, and transportation
  2. Determine whether or not to go hiking
  3. Give solutions for what to do during each type of weather
%%javascript

let weather = "sunny";
let transportation = "available";
let boots = "not present";

console.log("The weather is " + weather);
console.log("Your transportation is " + transportation);
console.log("Your boots are " + boots);

if (weather === "sunny") {
    if (transportation === "available") {
        if (boots === "present") {
            console.log("You are ready to go hiking!");
        } else {
            console.log("You need to find your boots first.");
        }
    } else {
        console.log("You need to arrange transportation.");
    }
} else {
    console.log("It's not good weather for hiking.");
}
<IPython.core.display.Javascript object>

<font color=#94c4ff>Popcorn Hack!</font>

Try adding an additional condition for hiking (like location_determined or miles_in_the_hike).

<font color=#94c4ff> Example 2 - Booleans </font>

  1. Write a code that checks if you can host movie night.
  2. Use the presence of a living room, a projector, and snacks to determine if movie night is possible
  3. Use booleans in the code
%%javascript

let living_room_available = true;
let projector_working = false;
let enough_snacks = true;

if (living_room_available) {
    if (projector_working) {
        if (enough_snacks) {
            console.log("You're ready to host the movie night!");
        } else {
            console.log("You need to get more snacks. Ideas: Popcorn, Candy, Soda");
        }
    } else {
        console.log("You need to fix or replace the projector.");
    }
} else {
    console.log("The living room is not available for the movie night. Find another room!");
}

<font color=#94c4ff>Popcorn Hack!</font>

Try changing some of the defined booleans and see what values you get!

<font color=#94c4ff> Example 3 - Integers, Booleans, AND Random </font>

  1. Write a code that checks if you can go on a spontaneous road trip
  2. Check if you have enough gas, if the weather is good, if you’ve checked your car, and if you have enough in your budget
  3. Use integers, booleans, and randomized values
%%javascript

// Boolean: Do you have enough gas? (Fixed)
let enough_gas = true;

// Random: Is the weather good? (Random outcome)
let good_weather = Math.random() < 0.5; // Random true or false

// Random: Did the car pass the check-up? (Random outcome)
let car_checked = Math.random() < 0.5; // Random true or false

// Integer: Your current budget (Random between $50 and $200)
let budget = Math.floor(Math.random() * (200 - 50 + 1)) + 50;
let required_budget = 100; // Assume you need $100 for the trip

// Check the conditions using nested conditionals
if (enough_gas) {
    console.log("You have enough gas!");
    if (good_weather) {
        console.log("The weather is good!");
        if (car_checked) {
            console.log("Your car has been checked!");
            if (budget >= required_budget) {
                console.log(`You're ready for the road trip! You have $${budget}, which is enough.`);
            } else {
                console.log(`You need more money for the trip. You only have $${budget}, but you need at least $${required_budget}.`);
            }
        } else {
            console.log("You need to get the car checked first.");
        }
    } else {
        console.log("The weather isn't good for a road trip.");
    }
} else {
    console.log("You need to fill up the tank first.");
}
<IPython.core.display.Javascript object>

<font color=#94c4ff>Popcorn Hack!</font>

Try changing the enough_gas variable to a randomly-generated value! Also, try adding a gas value and check that the number of gallons is sufficient.

Learn more about Javascript Nested Conditionals

Javascript Nested Conditionals - ThoughtCo