JavaScript Conditional Statements

Conditional Statements

Very often when you write code, you want to perform different actions for different decisions.

You can use conditional statements in your code to do this.

In JavaScript we have the following conditional statements:

  • Use if specify a block of code to be executed, if a specified condition is true
  • Use else to specify a block of code to be executed, if the same condition is false
  • Use else if to specify a new condition to test, if the first condition is false
  • Use switch to specify many alternative blocks of code to be executed

If Statements

It is used When Condition is True.

Syntax

if (condition) {
    code to be executed if condition is true;
}

The example below will output "Value of X is Small" if the value of x is less than 10:

Example

<script>
var x = 5;
if (x < 10) {
    document.write("Value of X is Small");
}
</script>

Run Example>>

If...else Statement

The if....else statement executes some code if a condition is true and another code if that condition is false.

Syntax

if (condition) {
    code to be executed if condition is true;
} else {
    code to be executed if condition is false;
}

The example below will output "You Can Give Vote" if the age is Grater than 18, and "You Can not Give Vote" otherwise:

Example

<script>
var age = 18;

if (age >= 18) {
    document.write ("You Can Give Vote");
} else {
    document.write( "You Can Not Give Vote");
}
</script>

Run Example>>

Nested If...else Statement

The if....elseif...else statement executes different codes for more than two conditions.

Syntax

if (condition) {
    code to be executed if this condition is true;
} elseif (condition) {
    code to be executed if this condition is true;
} else {
    code to be executed if all conditions are false;
}

The example below will output "You got Excellent Grade" if the marks is Grater than 80, "You got First Class" if the marks is Grater than 60 and less than equal to 80 and like wise second class,third class and fail :

Example

<script>
var marks = 80;
if (marks > 80) {
    document.write( "You got Excellent Grade");
} elseif (marks >= 60 && marks <= 80) {
    document.write("You got First Class");
} elseif (marks >= 50 && marks <= 60) {
    document.write("You got Second Class");
} elseif (marks >= 40 && marks <= 50) {
    document.write( "You got Third Class");
}
elseif (marks < 40) {
    document.write("You are Fail in Exam");
} else {
    document.write ("You are Absent in Exam");
}
</script>

Run Example>>

Switch Case Statements

The switch statement is used to perform different actions based on different conditions.

Use the switch statement to select one of many blocks of code to be executed.

Syntax

switch (n) {
    case label1:
        code to be executed if n=label1;
        break;
    case label2:
        code to be executed if n=label2;
        break;
    case label3:
        code to be executed if n=label3;
        break;
        ...
  default:
     code to be executed if n is different from all labels;
}

This is how it works: First we have a single expression n (most often a variable), that is evaluated once. The value of the expression is then compared with the values for each case in the structure. If there is a match, the block of code associated with that case is executed. Use break to prevent the code from running into the next case automatically. The default statement is used if no match is found.

Example

<script>
var favcolor = "red";

switch (favcolor) {
    case "red":
        document.write( "Your favorite color is red!");
        break;
    case "blue":
        document.write("Your favorite color is blue!");
        break;
    case "green":
        document.write("Your favorite color is green!");
        break;
    default:
        document.write("Your favorite color is neither red, blue, nor green!");
}
</script>

Run Example>>