If and else statements are some of the more commonly used words in not only JavaScript but most modern programming languages. They fall under an umbrella of concepts that use terms such as conditionals or boolean logic. The terminology is not as important as what they actually do. They help your code decide between two or more potential paths. They have a basic principle, which is, if statement one is true to statement two, then run the following code before the if is closed.

So their format is:

if (statement_one operator statement_two){
   //run code
}

That is not too clear, solely because of the operator part...which I haven't explained yet. The operator is what you use to compare/check statements one and two with. The operators you can use in JavaScript and what they do are listed below in terms of var1 and var2:

The above table lists the most common operators you will use. Now, it is time to explain how to use them. For the following examples, we will assume that variable_1 and variable_2 are values and have been initialized earlier.

If, for example, you wanted to check if variable_1 is greater than variable_2 you would use the following fragment of code:

if(variable_1 >= variable_2){

alert("variable 1 is greater than or equal to variable 2");

}

Similarly, to check if both variables are equal, you would use:

if(variable_1 == variable_2){

alert("variable 1 is equal to variable 2");

}

Let's say variable_1 is now equal to the string foo. If you are checking if variable_1 is equal to the string foo, you will need to use quotation marks on the foo to designate it as a string:

if(variable_1 == "foo"){

alert("variable 1 is equal to foo");

}

The == operator when applied to strings cares about capitalization. So "Foo" is not equal to "foo". If you want to check if the characters are the same, you can do a toUpperCase or toLowerCase on the text and then do the compare.

You can also daisy chain operators to perform more complicated logic evaluations:

if(variable_1 == variable_2 && variable_3 > variable_4){

alert("variable 1 is equal to variable 2 and variable 3 is greater than variable 4");

}

In the above statement, I check if variable_1 is equal to variable_2 and also check if variable_3 is greater than variable_4. Notice the order of operations does not check if variable_2 and variable_3 exist, even though at first glance it could look like that could be the case.

That is why it is recommended to use many parentheses to improve readability:

if((variable_1 == variable_2) && (variable_3 > variable_4)){

alert("variable 1 is equal to variable 2 and variable 3 is greater than variable 4");

}

Up until now, we have code that executes when the if statement is true. There will be cases, in fact almost always, when you want something to execute if the statement is false. Thus, this is where the else statement comes into play:

if(variable_1 == "foo"){

alert("variable 1 is equal to foo");

} else {

alert("variable 1 is not equal to foo");

}

In the above code, if variable_1 is not equal to foo, the code in the else statement will execute instead. Of course, to take this one step further, you can have multiple statements by extending else and if and getting else if. Else if allows you to have several if statements that evaluate in order as shown in the following code fragment:

if(variable_1 == 80){

alert("variable 1 is equal to 80");

} else if(variable_1 > 80){

alert("variable 1 is greater than 80");

} else {

alert("neither are true");

}

In the above code fragment you check if variable_1 is equal to 80, and if it is, you exit your code fragment and execute the code for the equal statement. If variable_1 does not equal 80, instead of jumping straight to the else statement, you stop at the else if statement and check if variable_1 is greater than 80 instead. Only if you fail again do you go to else for there is no where else for you to go!

When using else’s the code would not keep reading down if one statement is true. So, with the example code above, it would not read the } else if(variable_1 > 80){ if variable_1 is equal to 80, however if it isn’t equal to 80 it would read that code. The last else would not be read if either of the preceding statements are true.

So with this, I think you have a good idea of what you can do using if and else statements. They are quite fundamental for most programs, so it is good to be familiarized with them to a point where you don't spend too much time thinking about them.

If you have any questions, feel free to post on the kirupa.com forums.

Cheers!

Nathan Stockton