Introduction to "if - else" Branching

Branching that involves "if - else" allows your program to behave very differently depending on what a user inputs. For example, you could write a script that would act one way toward you and a different way toward everyone else. Here's the basic form of an if - then statement:

if (some condition is true) {
     do something;
     do something;
     do something;
}

— OR —

// don't need the {}s if there is just one statement
if (some condition is true) do something;

— OR — Here's the basic form of an if - else statement:

if (some condition is true) {
     do something;
     do something;
     do something;
}
else {
     do something else;
     do something else;
     do something else;
}

The important parts of this structure are:

  • It starts with the word "if" (if must be lowercase).
  • There is a condition in parentheses that is either true or false.
  • There is a set of statements that should be executed if the condition is true. These statements go between curly brackets.

Remember, spacing is only there to make the script more legible. You can put the entire if - then statement on one line if you want, but that would be hard to read.

Here's an example of an if-then statement in action.

"if" statements have two parts. The first part evaluates whether a value is true or false and the second part of the statement contains the appropriate responses. We'll look first at the process of evaluating true and false.

The first part of the "if" statement

You can use logical operators to create statements that "evaluate" to either true or Here's the basic form of an if - then statement. The following examples illustrate this:

  • 5 == 5
    This statement evaluates to true because 5 is EQUAL TO 5.
  • 5 == 6
    This statement evaluates to false because 5 isn't EQUAL TO 6.
  • 5 != 6
    This statement evaluates to true because 5 is NOT EQUAL TO 6.
  • 5==5 && 6==6
    This statement evaluates to true because statement one AND statement two are both true.
  • 5==5 && 5==6 This statement evaluates to false because statement one AND statement two are not both true, (even though statement one is true).
  • 5==5 || 5==6
    This statement evaluates to true because either statement one OR statement two is true.

As is often the case, the hardest part about learning to use logical operators is remembering what the symbols mean. In most cases, you'll find the basic ideas pretty intuitive as long as you can easily read and write the symbols.

The second part of the "if" statement

The second component of the "if" statement is pretty simple. It's just one or more lines of code which will be executed only if the logical statement in the first part of the "if" statement evaluates to true. These lines of code are enclosed within curly brackets.

if (x > 0) {
      alert("It's not a negative number.");
      alert("It's greater than zero.");
}

Here's what "if" statements look like.

The following are several examples of "if" statements. As you'll see, the first word is always "if", and that is followed by a statement enclosed in parentheses. This statement in the parentheses either evaluates to true or false. If it evaluates to true, the actions enclosed in the curly brackets that follow it will be executed. If the statement in the parentheses evaluates to false, nothing will happen.

if (x == 10) {
      alert("It's equal to 10.");
}

if (x != 10) {
      alert("It's not equal to 10.");
}

if (x > 10) {
      alert("It's greater than 10.");
}

if (x > 5 && x < 10) {
      alert("It's greater than 5 and it's less than 10.");
}

if (x > 10 || x < 5) {
      alert("It's either greater than 10 or it's less than 5.");
}

"else" statements

You can use the "else" statement immediately following an "if" statement if you want a set of commands to be executed in the event that the "if" statement evaluates to false. It looks like this:

if (x > 10) {
      alert("It's greater than 10.");
}
else {
      alert("It must be less or equal than 10.");
}

— OR —

if (x > 10) alert("It's greater than 10.");
else alert("It must be less or equal than 10.");