With any programming language, there is a great amount od time sent on testing if a specific condition is met: If so, do this, if not, do that.

There might also be several conditions to test, and several actions to take for each condition tested.

Some examples could be:

  • If a test answer is correct, increase the total score, if not tell the user he was wrong.
  • If the visitor chooses chairs over sofas, go to the dog page. Once at the dog page, if the visitor chooses recliners, show the recliner list, if he chooses high back chairs, go to that list, etc.

You might also have more complex conditions to be met like

  • the visitor wants recliners AND he want leather
  • the visitor has 3 children but he doesNOT have any daughters
  • the visitor is over 21 years old AND he lives in Oregon

aa-three-dots

JavaScript if statements

The syntax of an if statement is the word if, followed by a condition in parentheses, an open curly bracket, the action to take then a closed curly bracket. You do not end a conditional statement with a semicolon.\, but you will use semicolons at the end of each action to take within the curly brackets.

if (condition to test){
  // actions to take if condition is true
}

An if statement tests if something returns true then does the action. If the if statement does not return true, the program then continues with the next step and does not do the action. No special action is taken if the condition does not return true.

var total = 34;
if (total < 40) {
    sumTotal = total + 1; // the statement within the brackets get semicolons
}

aa-three-dots

JavaScript if / else statements

An if / else statement tests if the condition is true, if so does the actions in the first part of the statement, if not true, does the actions following else in the second part of the statement. If / else statements are for either/or situations, not for multiple choice situations.

The syntax of an if / else statement is as follows

if (condition to test) {
   // steps to take if true
} else {
    // steps to take if not true
}

var question1 = "c";
var question2 = "b";
var answer1 = "a";
var answer2 = "b";
if  (answer1 == question1) {
    document.write("Correct");
} else {
    document.write("Incorrect");
}

aa-three-dots

JavaScript if / else if / else statements

An if / else if / else statement tests multiple conditions. You can make the last part be simple else if none of the other conditions return true.

The syntax of an if / else if statement is as follows:

if (condition to test) {
    // actions to take
} else if (condition to test) {
    // actions to take
} else if (condition to test) {
    // actions to test 
} else {

}

Let's look at an example of if / else if:

var total = 14;
var testVal = 30;
if (total < testVal){ // this tests if total is less than testVal
    // actions go here
} else if (total == testVal) { // this text if total is equal to testVal
    // actions go here
} else {  // this happens if the above conditions did not return true
    // actions go here
}

aa-three-dots

Comparison Operators

JavaScript uses comparison operators to test for these conditions for if and if / else statements

OperatorNameResult
== equal returns true if the operands are of equal value
!= not equal returns true if the operands are not of equal value
=== strict equal returns true if the operands are equal and of the same type
!== strict not equal returns true if the operands are not equal and/or not of the same type
greater than returns true if the value of the left operand is greater than the value of the right operand
< less than returns true if the value of the left operand is less than the value of the right operand
>= greater than or equal to returns true if the value of the left operand is greater than or equal to the value of the right operand
<= less than or equal to returns true if the value of the left operand is less than or equal to the value of the right operand

Comparison Operators will returns a Boolean value of true if the condition being tested is true. Conditional statements use this information to decide whether to take some action. If the test returns true, take some action, if not do not take this action.

Remember that a single equal sign = is an assignment operator, it assigns the value to the variable.

var valueA = 30;
var valueB = 60;
var valueC = 30;

(valueA == valueC) // returns true
(valueA != valueB) // returns true
(valueC >  valueB) // returns false