JavaScript

JavaScript: If…else

JavaScript: If…else

Many times in programming, there are various situations where choices are to be made depending upon certain conditions. These choices are important as they determine the fate of the rest of the execution of the JavaScript code. These choices can be made using conditional statements. These statements are built in such a way that they equip the program to make the right choice after considering the given conditions. 

Conditional statements are supported in JavaScript, allowing you to execute various actions depending upon different conditions. 

Following are the if…else statements that JavaScript supports:

  1. if statement
  2. if...else statement
  3. if...else if... statement.

Understanding if statement

Being one of the fundamental statements in JavaScript, the if statement can be used to carry out actions depending on the given conditions.

Following is the syntax used for the if statement in JavaScript code:

if (expression needed to be executed) {
   The Statement that has to be executed if the above expression holds the value true.
}

These statements are used mostly when there is a need to make a certain decision after analyzing the provided conditions. If the provided condition holds the value true, then the statement defined under that expression will be executed. If the provided condition holds the value of false, then no statement will be executed. 

Following is an example of a JavaScript code using above mentioned if statements: 

<html>
   <body>     
      <script type = "text/javascript">
         <!--
            var attempts = 4;
         
            if( attempts > 2 ) {
               document.write("<b>Verified for programming.</b>");
            }
         //-->
      </script>     
   </body>
</html>

The output for the program is:

Verified for programming.

Understanding if…else statement

Going one step further, the Statement to be executed when the expression defined in the if block is not true can be defined using the else statement. 

Following is the syntax used for the if…else statement in JavaScript code:

if (expression needed to be executed) {
   The Statement that has to be executed if the above expression holds the value true.
} else {
   The Statement that has to be executed if the above expression holds the value false.
}

When the expression in the if statement holds the value true, then the statement mentioned under the if block is executed. If the expression in the if statement holds the value false, then the statement mentioned under the else block is executed. 

Following is an example of a JavaScript code using above mentioned if…else statements: 

<html>
   <body>   
      <script type = "text/javascript">
         <!--
            var attempt = 2;
         
            if( attempt > 4 ) {
               document.write("<b>Verified for programming.</b>");
            } else {
               document.write("<b>Not verified for programming.</b>");
            }
         //-->
      </script> 
   </body>
</html>

The output for the program is:

Not verified for programming.

Understanding if…else if… statement

If you want more control over the execution of the statements, then you can use if…else if… statements. These statements can work with multiple conditions and can execute statements after analyzing the provided conditions and determining the correct path. 

Following is the syntax used for the if…else if… statement in JavaScript code:

if (expression needed to be executed first) {
   The Statement that has to be executed if the above expression holds the value true.
} else if (expression needed to be executed second) {
   The Statement that has to be executed if the above expression holds the value true.
} else if (expression needed to be executed third) {
   The Statement that has to be executed if the above expression holds the value true.
} else {
   The Statement that has to be executed if all the above expressions hold the value false.
}

The working of these statements can be easily understood after studying and practicing the above two statements. In simple words, there are many conditions that can be defined, and simultaneously unique statements can be defined under each expression. Also, in case all the above-mentioned expressions hold the value false, then a statement for this condition can also be defined under the else block. These types of statements are very handy as they tend to execute many conditions in one go without lengthening the JavaScript code and help in reducing any complexities. 

Following is an example of a JavaScript code using above mentioned if…else if… statements: 

html>
   <body>   
      <script type = "text/javascript">
         <!--
            var attempts= 6;
            if( attempts >= 6 ) {
               document.write("<b>Verified for programming in the first round.</b>");
            } else if( attempts >= 4 ) {
               document.write("<b>Verified for programming in the second round.</b>");
            } else if( attempts >= 2 ) {
               document.write("<b>Verified for programming in the third round.</b>");
            } else {
               document.write("<b>Not verified for programming.</b>");
            }
         //-->
      </script>      
   </body>
<html>

The output for the program is:

Verified for programming in the first round.