Tutorial Gateway

JavaScript If Else Statement

by

The JavaScript If Else Statement is an extension to the If statement (which we discussed in the earlier post). We already seen the Js If Statement, it will only executes the statements when the given condition is true and if the condition is false, it will not execute any statements.

In real world, it would be nice to execute something when the condition fails. To do so, We have to use this JavaScript If else statement. Here, Else statement will execute the statements when the condition fails. Let us see the syntax of the JavaScript If Else condition:

JavaScript If Else Statement Syntax

The syntax of the If Else Statement in JavaScript is as follows:

if (Test condition)
{
  //If the condition is TRUE then these statements will be executed
  True statements;
}

else
{
  //If the condition is FALSE then these statements will be executed
  False statements;
}

If the test condition present in the above structure is true then True statements will execute. If the condition is false then False statements will executed.

Flow Chart for JavaScript If Else Statement

Let us see the flow chart of the JavaScript if else statement for better understanding.

JavaScript Else Statement flow chart

If the test condition of the JavaScript If Else Statement is true then STATEMENT 1 is executed followed by STATEMENT N. If the condition is False then STATEMENT 2 will execute and then STATEMENT N is executed. Because, it is out of the if else condition block, and it has nothing to do with the condition result.

JavaScript If Else Statement Example

In this if else statement example program, we are going to place four different statements.

If the condition is true, we will display two different statements. If the condition is false, we will display another two statements.

<!DOCTYPE html>

<html>
<head>
    <title> JavaScript Else Statement </title>
</head>
 <h1> JavaScript Else Statement </h1>
<body>
<script>
  var marks = 60;
  if( marks >= 50 )
  {
    document.write("<b> Congratulations </b>"); //s1
    document.write("<br\> You Passed the subject" ); //s2
  }
  else
  {
    document.write("<b> You Failed </b>"); //s3
    document.write("<br\> Better Luck Next Time" ); //s4
  }
</script>
</body>
</html>

OUTPUT 1: Here marks is 60 and the Condition is TRUE that’s why, statements inside the If Statement is displayed as Browser output

JavaScript Else Statement 1

OUTPUT 2: Here we changed the marks variable to 30. It means the Condition is FALSE that’s why, statements inside the Else Statement is displayed as an output

JavaScript Else Statement 2