News: JavaScript - Else If

Home News Photos News Videos News Cartoons News Blogs RSS

Home > Java Scripts Examples and Tutorials > JavaScript - Else If

JavaScript - Else If

When the condition is 'true' the if statement block is executed while the statement block in else is executed when the condition is 'false'. However, as in life, things are rarely black or white... there are always shades of grey.

Monday, Dec 18, 2006 | 1934 Views | Comments [View/Post]

The JavaScript if - else statements also provides for else if clauses through which we can make additional branches to the condition.

if (number > 0)
   {
   alert("Number is a positive integer");
   }
else if (number < 0)
   {
   alert("Number is a negative integer");
   }
else
   {
   alert("Number is 0");
   }

Note that the else if clause is followed by another condition placed between parenthesis. If this condition is true, the statement inside the else if block are executed.
The code above checks the value of variable number. When number is greater than 0, the statements in if block are executed and when number is less than 0, the statements in else if block take over. Finally, if the number is equal to zero, the conditions in if and else if are 'false' and the program execution falls to the statements in else clause block.

When you first entered this page, you received a greeting. This greeting is customized according to the time on the client (your) machine. Let's see how it works.

var d = new Date();
var t_hour = d.getHours();

if (t_hour <= 3)
   {
   alert("Hello dear visitor,nWorking late aren't we?");
   }
else if (t_hour > 3 && t_hour < 12)
   {
   alert("Good morning dear visitor");
   }
else if (t_hour >=12 && t_hour <= 16)
   {
   alert("Good afternoon dear visitor");
   }
else
   {
   alert("Good Evening dear visitor");
   }

We first initialize a variable using the new operator with the Date() contruct. The value of hours is stored in t_hour variable by employing the getHours() method of the date object. The value of t_hour variable is then passed through if-else if-else conditions. Thus, depending on the time of the day (time in hours), a greeting is displayed in an alert box.
You'll recall that JavaScript clock is a 24 hour clock.

  • When t_hour is less than equal to 3 (0, 1, 2, or 3): alert box displays "Hello dear visitor,nWorking late aren't we?".
  • When t_hour is more than 3 AND less than 12: alert box displays "Good morning dear visitor".
  • If the value of t_hour is greater than equal to 12 AND less than equal to 16: "Good afternoon dear visitor" is displayed in the alert box.
  • For all other values of t_hour (17, 18, 19, 20, 21, 22, and 23): alert box displays "Good Evening dear visitor".

You can check this script by changing the time on your machine and clicking on the above link.


 

The && and || operators
The && (AND) and || (OR) are logical operators. They are used to extend conditions.

if (number > 4)
   {
   statements...
   }

The above condition checks is variable number is greater than 4. To check if this variable value lies between 10 and 4, we employ the && operator.

if (number > 4 && number < 10)
   {
   statements...
   }

Thus, the statements inside the if block will be executed if number equals 5, 6, 7, 8 or 9.

Now, if we want to display an alert box if the value of number variable is less than 20 or more than 50, we use the || operator.

if (number < 20 || number > 50)
   {
   alert("...");
   }

In the code above, an alert box will be displayed if number is 18, 5, -435, 51, 324... However, if the value of number lies between 20 and 50 (included 20 and 50), no alert box will be displayed.


Comment on this article
Guidelines: You must register with a social media account such as Facebook, Twitter, Yahoo, etc. to comment on this story. Click on the "Login" button below to choose your login account of choice. We welcome your thoughts, but this is not an open forum. For the sake of all readers, please refrain from the use of obscenities, personal attacks or racial slurs. All comments must remain on topic and cyber bullying will not be tolerated. All comments are subject to our terms of service. Comments that do not comply may be removed. Repeat offenders will lose commenting privileges.
News Other Language
World News
Movie News
Information
Travel News