|
Conditional statements in JS are used to perform different actions based on different conditions. As your JS programs get more sophisticated you will need to make use of conditional statements that allow your program to make decisions. Nearly all other programming languages use conditionals and JS is no exception. The If Statement is a way to make decisions based on a variable or some other type of data. For example you might have a variable that stores the date. With this tiny bit of information you could easily program a small script to print out "Today is my Birthday!" whenever the day and month were equal to your birthday. This lesson will teach you the basics of using an If Statement in Javascript. ExamplesIf statement How to write an if statement. If...else statement How to write an if...else statement. If..else if...else statement How to write an if..else if...else statement. 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: if statement - use this statement if you want to execute some code only if a specified condition is true if...else statement - use this statement if you want to execute some code if the condition is true and another code if the condition is false if...else if....else statement - use this statement if you want to select one of many blocks of code to be executed switch statement - use this statement if you want to select one of many blocks of code to be executed
Javascript If Statement SyntaxThere are two major parts to an if statement: the conditional statement and the code to be executed. The conditional statement is a statement that will assess to either True or False. The most common type of a conditional statement used is checking to see if something equals a value. An example would be checking if the date equaled your birthday. The code to be executed contains the Javascript code that will be executed only if the If Statement's conditional statement was true. In this simple If Statement example we print out a message if the variable we are checking is equal to 7. Javascript Code:<script type="text/javascript"> <!— var myNum = 7; if(myNum == 7){ document.write("Lucky 7!"); } //--> </script> Display:Lucky 7! This simple example created myNum and set it to 7. We then checked to see if myNum was equal to 7 "myNum == 7" in the If Statement's conditional statement which evaluated to True. Because the conditional statement was True the block of code associated with our If Statement "document.write..." was executed, as you can see in the Display. Javascript If Statement: ElseWe already taught you how to execute code if a given condition is True, but what if you want to execute another piece of code if something is False? The answer is to use an extension to the If Statement; the Else clause. The Else clause is executed when the conditional statement is False. Let's take our example from above, add an Else clause and change the value of myNum so that our conditional statement is False. Javascript Code:<script type="text/javascript"> <!-- var myNum = 10; if(myNum == 7){ document.write("Lucky 7!"); }else{ document.write("You're not very lucky today..."); } //--> </script> Display:You're not very lucky today... If...else if...else StatementYou should use the if....else if...else statement if you want to select one of many sets of lines to execute. Syntax if (condition1) { code to be executed if condition1 is true } else if (condition2) { code to be executed if condition2 is true } else { code to be executed if condition1 and condition2 are not true } Example<script type="text/javascript"> var d = new Date() var time = d.getHours() if (time<10) { document.write("<b>Good morning</b>"); } else if (time>10 && time<16) { document.write("<b>Good day</b>"); } else { document.write("<b>Hello World!</b>"); } </script> Javascript Else If StatementIn the previous lesson you learned how to create a basic If Statement in Javascript, which is good enough for most programming situations. However, sometimes it is helpful to have the ability to check for more than one condition in a single If Statement block. The Else If statement is an extension to the If Statement that allows you to create as many checks (conditional statements) as you want. Javascript Else If ExampleImagine that you want to have a small "student" script that will print out a customized message depending who is accessing the web page. If you had more than two custom messages you could use the Else If extension to solve this programming problem. Javascript Code: <script type="text/javascript"> <!-- var visitor = "principal"; if(visitor == "teacher"){ document.write("My dog ate my homework..."); }else if(visitor == "principal"){ document.write("What stink bombs?"); } else { document.write("How do you do?"); } //--> </script> Display:What stink bombs? There are two important things to note about the Else If extension: You must have a normal If Statement before you can use the Else If statement. This is because the Else If statement is an addon to the If Statement. YOu can have multiple Else If add-ons. In our example we only used one Else If extension, but you can add as many as you require.
|