if Statement With Multiple Boolean Expressions

Sometimes we want to have multiple conditions because one is not enough.

This `OR` That, This `AND` That¶

"If I were taller OR that shelf was lower, I could reach that can of soup."
"Could I have 20 ones OR a ten and 10 ones OR even 2 fives and 10 ones?"
"You have to wear a shirt AND shoes to enter this premise!"
"If you are older than 5 AND younger than 12 then the cost is $1"

The Logical OR `||`¶

In JavaScript the logical OR is ||. That is two vertical bars. That key is in different places depending on the keyboard. Where is it on yours? You use it like this:

function multipleBooleans1() {
    // Logical OR
    const UPPER_BOUNDARY = 10;
    const LOWER_BOUNDARY = 1;

    let number;

    number = 25;

    if (number > UPPER_BOUNDARY || number < LOWER_BOUNDARY) {
        document.write("The number is not between ");
        document.write(LOWER_BOUNDARY)
        document.write(" and ");
        document.write(UPPER_BOUNDARY);
        document.write("!");
    }
}

This is wrong¶

// Wrong!
    if (number > UPPER_BOUNDARY || < LOWER_BOUNDARY) { //<-- Wrong, missing variable name!

    }

This is correct¶

// Right!
    if (number > UPPER_BOUNDARY || number < LOWER_BOUNDARY) {  //<-- You always have to have
                                                               // a complete boolean expression
    }                                                          // on each side of the ||

Either one of the expressions can be true and the whole thing is true!¶

multiple Booleans with logical or

The Logical AND `&&`¶

In JavaScript the logical AND is &&, two ampersands. Here's how we use it.

/function multipleBooleans2() {
    // Logical AND

    const BONUS_BOUNDARY = 25;
    const BONUS_CODE = 5;

    let numberOne;
    let code;

    numberOne = 30;
    code = 5;

    if (numberOne > BONUS_BOUNDARY && code === BONUS_CODE) {
        document.write("Bonus time!");
    } else {
        document.write("No bonus this year.");
    }
}

Both of the boolean expression have to be true. If either one is false then the whole thing is false.¶

multiple booleans with logical and

Here's a logical AND example¶

function multipleBooleans3() {

    // Logical AND example
    const UPPER_LIMIT = 10;
    const LOWER_LIMIT = 0;

    let countEntry;
    let count;

    countEntry = prompt("Enter a number between 1 and 10");
    if (isNumeric(countEntry)) {
        count = Number(countEntry);
    } else {
        alert("Entered value for number is not numeric.");
    }

    if (count > LOWER_LIMIT && count <= UPPER_LIMIT) {
        alert("The number is in the correct range");
    } else {
        alert("The number is NOT in the correct range");
    }

    return;
}

** Click me to run multipleBooleans3() **

Take note of the return statement in this program. This will stop the program from finishing the function. We will learn more about this in upcoming units. For now, just know that it will stop this function as soon as the return statement is reached.

Here's an `if/else`¶

function multipleBooleans4() {

    // Logical AND example with if/else
    const SIZE_MINIMUM = 0;
    const VALID_CODE = "B";

    let sizeEntry;
    let size;
    let code;

    sizeEntry = prompt("Enter a size in feet");
    code = prompt("Enter a code: A, B, or C");
    if (isNumeric(sizeEntry)) {
        size = Number(sizeEntry);
    } else {
        alert("Entered value for size is not numeric.");
        return;
    }

    if (size > SIZE_MINIMUM && code === VALID_CODE) {
        alert("That is just right!");
    } else {
        alert("That's not it, please try again.");
    }
}

** Click me to run multipleBooleans4() **

Note: Refresh the page to return to the course content

Demo

Demo: Drivers License
- unit03/demos/demo-drivers-license.html

Hands on Work¶

Labs

Lab06: Multiple Booleans
- unit03/labs/lab-06-multipleBooleans.html

Exercises

Exercise for lab05
- unit03/exercises/exercise-05.html