Nested Conditionals

1. LxD Cycle Process

Empathize: Students don’t know how a comouter narrows down your inputs. Define:

POV: You have a conditional but you need another way of making your code more specific so the out put is more specific to your needs.
Learning Goal: Students will be able to cleanly impement a nested conditional inside of an existing conditional and wilkl understand why we need to use nested conditionals.

Ideate:

HMW Question: What is the difference between a nested conditional and a regular conditional.
Activity: Try the Nfl and Leap Year Coderunner.

2. Key Vocab

Type	Meaning	Example	Notes
`conditional`	true/false	`if .... else....`	determine what to print
`boolean`	True/False	`boolean done = false;`	Used for conditions
`char`	Single character	`char grade = 'A';`	Always single quotes
`string`	Text (sequence of chars)	`String name = "Paul";`	Not primitive
`array`	multiple values in one variable)	`numbers = [1, 2], [3, 4]`	Multiple values in one variable

3. Lesson Plan & Introduction

Imagine this: You’re deciding what to do on a Saturday afternoon.

First, you check whether you have tickets for a movie.

IF you have movie tickets:

You go to the theater, but then you need to check one more thing - did you bring snacks?
- IF you brought snacks, you enjoy the movie with popcorn and a drink.
- ELSE (if you have tickets but no snacks), you buy snacks at the theater.

ELSE (if you do not have movie tickets):

You plan an outdoor activity, BUT you still need to check the weather.
- IF it is sunny, you go to the park.
- ELSE, you stay home and play a board game.

See how you’re making decisions INSIDE other decisions? That’s a nested conditional!

Nested Conditional Code

Now let’s look at an example of nested conditional code using the weekend-plans analogy above.

// Decide what to do on Saturday afternoon
if (hasMovieTickets) {
    // First decision: We have tickets, so go to the theater
    goToTheater();

    // Nested decision INSIDE the movie-ticket condition
    if (hasSnacks) {
        console.log("Enjoying the movie with snacks");
    } else {
        buySnacks();
        console.log("Buying snacks at the theater");
    }

} else {
    // First decision: No tickets, so plan an outdoor activity

    // Nested decision INSIDE the no-tickets condition
    if (isSunny) {
        goToPark();
        console.log("Going to the park");
    } else {
        playBoardGame();
        console.log("Staying home to play a board game");
    }
}

In the code example above, there are 2 nested conditionals: there’s one in the if statement, and one in the else statement. If you have movie tickets, the snack check inside the if block will run. If you do not have movie tickets, we skip the if block entirely and go to the else statement, where a weather check will run.

Now you go ahead and try!

4. Code Runner Interactive Madden NFL Popcorn Hack

Lets say you want to know which team from a certain division you want to use in the Madden Nfl game, you can run this code and add a nested conditional so you can figure out what team you want to use.

Code Runner Challenge

Add nested conditionals to identify each NFL team's division.

View IPYNB Source

%%js

// CODE_RUNNER: Add nested conditionals to identify each NFL team's division.
// The outer conditional is already written for you. Add a nested conditional
// inside each conference block to check the team's division.

//Array of Data for my conditionoal⬇️
const NFL_TEAMS = [
    { name: "Buffalo Bills", conference: "AFC", division: "East" },
    { name: "Baltimore Ravens", conference: "AFC", division: "North" },
    { name: "Houston Texans", conference: "AFC", division: "South" },
    { name: "Kansas City Chiefs", conference: "AFC", division: "West" },
    { name: "Detroit Lions", conference: "NFC", division: "North" },
    { name: "Atlanta Falcons", conference: "NFC", division: "South" },
    { name: "Dallas Cowboys", conference: "NFC", division: "East" },
    { name: "San Francisco 49ers", conference: "NFC", division: "West" }
];
//loop for my conditional test⬇️
for (const team of NFL_TEAMS) {
    //this is my outer conditional test⬇️
    if (team.conference === "AFC") {
        console.log(team.name + " is in the AFC");

        // TODO: Add a nested conditional for AFC North, South, East, or West.
        // Example output: Buffalo Bills are in the AFC East.
    //default if test fails⬇️
    } else {
        console.log(team.name + " is in the NFC");

        // TODO: Add a nested conditional for NFC North, South, East, or West.
        // Example output: Dallas Cowboys are in the NFC East.
    }
}

// Expected output after completing the nested conditionals:
// Buffalo Bills are in the AFC East.
// Baltimore Ravens are in the AFC North.
// Houston Texans are in the AFC South.
// Kansas City Chiefs are in the AFC West.
// Detroit Lions are in the NFC North.
// Atlanta Falcons are in the NFC South.
// Dallas Cowboys are in the NFC East.
// San Francisco 49ers are in the NFC West.

Lines: 1 Characters: 0

Output

Click "Run" in code control panel to see output ...

Code Runner Challenge

Interactive nested conditional activity

View IPYNB Source

%%js

// CODE_RUNNER: Interactive nested conditional activity
// Add a nested conditional to check which years are leap years.
// Change the values in YEARS_TO_TEST to test other years.

const YEARS_TO_TEST = [2024, 2023, 1900, 2000];

for (const year of YEARS_TO_TEST) {
    // Outer conditional: first check whether the input is a valid year.
    if (Number.isInteger(year) && year > 0) {
        console.log("You entered the year " + year + ".");

        // TODO: Add a nested conditional to check whether the year is a leap year.
        // A year is a leap year when:
        // 1. It is divisible by 4, AND
        // 2. It is not divisible by 100, UNLESS it is also divisible by 400.
        //
        // Expected messages:
        // "2024 is a leap year."
        // "2023 is not a leap year."

    } else {
        console.log("Please enter a positive whole number for the year.");
    }
}

// Test values:
// 2024 -> leap yearz
// 2023 -> not a leap year
// 1900 -> not a leap year
// 2000 -> leap year

Lines: 1 Characters: 0

Output

Click "Run" in code control panel to see output ...

5. Summary

To Revise, nested conditionals are just a conditional inside of another conditional. Thats what the term nested means. So for homework I want you guys to make ONE nested conditional in the code runner below that contains more than one nested conditional, uses the numbers 1-50, and for the nested conditional, checks if each number is divisible by 5.

6. Grading Plan (1 Point Total)

Part	Points	What earns the points
Popcorn	0.50	NFL and Leap Year code runs perfectly
Homework: Own Nested Conditional	0.5	Students run and check if code checking each number is divisible by 50 or not.

Quick Validation Checklist

Screenshot of each code runner working perfectly

Homework Hack

Make a nested conditional that does the following:

contains more than 1 nested conditional
use the numbers 1-50
check if each number is divisible by each factor of 5
At the end submit a screenshot of this and the earlier code runners into the submission box at the bottom

Code Runner Challenge

Make a nested conditional homework

View IPYNB Source

%%js

// CODE_RUNNER: Make a nested conditional homework

Lines: 1 Characters: 0

Output

Click "Run" in code control panel to see output ...

7. Revisions:

Feedback Received:

Revision Made:

Need to update a submission later? Open the submissions dashboard.