in

Introduction To JavaScript if… Else Statement

In this tutorial we will be discussing about JavaScript If Else Statement which entails how to use the if and else statements in making the right decisions using JavaScript. In our previous tutorial we discussed about JavaScript Operators and we looked at all the operators available in JavaScript. If you haven’t gone through the tutorial you can do so using the link below

Read previous tutorial on: JAVASCRIPT OPERATORS | Introduction to Operators used in JavaScript

JavaScript if Else Statement

Imagine a situation where you want a decision to be made based on the outcome of an action, and there are more than one decisions to be made and each decision depends on the result you got from carrying out an action. For Example, if the result of the solution to a mathematical problem is 2 you want A to be printed out, but if the result is above 2 you want be to be printed out.

Issues like this draws us to the use of conditional statements in JavaScript. Condition statements in JavaScript allows us to make useful and right decisions based on the outcome of a particular action.

A typical conditional statement supported in JavaScript is the IF and ELSE statement. Below is a flow chart showing how this statement works.

JavaScript if... Else Statement
flow chart for if else statement

The below statements are supported in javaScript

  • if statement
  • if else statement
  • if …else if statement

The if statement

This is a conditional one way statement that allows JavaScript to execute an action ones the result is true. The syntax for IF Statement is shown below

if (expression to be checked) { statement to be executed if result is true}

Please note that this statement only executes when the result is TRUE. if the result is FALSE nothing executes.

Example using JavaScript

<!DOCTYPE html>
<html lang="en">
<head>
   
   <title>JAVASCRIPT IF STATEMENT </title>
</head>
<body>

   <script type="text/javascript" name="javascript"> 
      var a = 10;
      var b = 20;
      if (a > 9){
         document.write('a is greater than 9')
      }
   </script>
   
</body>
</html>

RESULT ON WEB PAGE

JAVASCRIPT IF STATEMENT

The if… else Statement

The IF else statement is similar to the IF statement just that unlike the if statement, when the result is FALSE another action is carried out without running a new check.

The syntax for if…else statement is shown below

if (expression to be checked) { statement to be executed if result is true}
else {statement to be executed if result is false}

Example shown below

<!DOCTYPE html>
<html lang="en">
<head>
   
   <title>JAVASCRIPT IF ELSE STATEMENT </title>
</head>
<body>


   <script type="text/javascript" name="javascript"> 
   
      var a = 10;
      var b = 20;
      if (a > 15){
         document.write('a is greater ')
      }
      else {
         document.write('a is not greater ')
      }
     
   </script>
   
</body>
</html>

RESULT ON THE WEB PAGE

JAVASCRIPT IF STATEMENT

The IF Else IF statement

The if Else If statement is the further and advance form of the IF Else statement which looks at multiple conditions before executing an action. The syntax for the IF Else If Statement is shown below

if (expression to be checked 1) {
   Statement(s) to be executed if expression 1 is true
} else if (expression to be checked 2) {
   Statement(s) to be executed if expression 2 is true
} else if (expression to be checked 3) {
   Statement(s) to be executed if expression 3 is true
} else {
   Statement(s) to be executed if no expression is true
}

Example using JavaScript

<!DOCTYPE html>
<html lang="en">
<head>
   
   <title>JAVASCRIPT IF...Else If STATEMENT </title>
</head>
<body>


   <script type="text/javascript" name="javascript"> 
   
      var a = "goat";
      var b = "cow";
      if (a == "hen"){
         document.write('a is hen ')
      }
      else if (a=="pig" ) 
      {
         document.write('a is pig ')
      }
      else if (a=="fox" ) 
      {
         document.write('a is fox ')
         
      }
      else if (a=="goat" ) 
      {
         document.write('a is goat ')
      }
     else {
      document.write('a is none ')
     }
   </script>
   
</body>
</html>

RESULT

JAVASCRIPT IF STATEMENT

CONCLUSION

The JavaScript if Else Statement are used to make proper and right decisions based on certain conditions. With the help of this tutorial we hope you now fully understand how to make use of statements in making the right decision using JavaScript.

Next tutorial : JAVASCRIPT SWITCH CASE

What do you think?

javascript operators

JAVASCRIPT OPERATORS | Introduction to Operators used in JavaScript

javascript switch case

Introduction to JavaScript Switch Case