Switch statements
Sometimes you need your program to handle various different possibilities and to execute different code in each. Although you could achieve this by using a conditional with multiple else if
statements, it is often simpler is to use a switch
statement. A switch
statement evaluates an expression and compares its value with one or more case
expressions; if one of these case
expressions provides a match, some associated code is executed.
Let’s take an example:
external $; string favoriteColor; string colorComment; favoriteColor = "green"; switch (favoriteColor) { case "red": colorComment = "red is fantastic"; break; case "blue": colorComment = "blue is wonderful"; break; case "green": colorComment = "green is magical"; break; case "yellow": colorComment = "yellow is brilliant"; break; default: colorComment = "I have no favorite color"; break; } $("#content").text(colorComment);
In this example, the switch
statement compares the value of the string favoriteColor
with the various case
expressions listed. When it finds a match, it executes the associated code. Since the value of favoriteColor
is “green”, the switch statement executes the code associated with that case: the string colorComment
is set to “green is magical
“.
What is the purpose of the break
and default
keywords? The break
keyword is very important because it’s needed if you want to prevent so-called “fallthrough”. Fallthrough happens when a switch statement executes the code associated with one or more cases after the matching case. For example, if you remove the break
at the end of the green case, the switch statement will go on to set colorComment
to “yellow is brilliant
“. In some rare situations you may want fallthrough of this sort; if so, you would intentionally omit break. (You would also be advised to add a comment explicitly indicating that the fallthrough was intended.) Usually, however, you will want to include break
at the end of each case.
The code in the default
clause is executed if none of the case expressions match the original expression. The default
clause is optional: if you don’t provide one, then the program resumes execution at the first statement after the switch statement.
JS++ | Conditional Statements
Conditional statements of various kinds play a central role in JS++. In this tutorial, we will look at the basic syntax and some common uses of such statements, and we will also introduce two kinds of expressions that are often used in conditionals: comparison operators and logical operators.
Note: JS++ conditionals, comparison operators, and logical operators work in a similar way to their counterparts in languages such as JavaScript, Java, C++, and C#.
Let’s start by making a new folder – name it “Conditionals”. Then make a new file and name it “Conditionals.jspp”. Write in the following code:
external $; string colorString; bool likesRed = true; if (likesRed) { colorString = "red"; } $("#content").text(colorString); $("#content").css("color", colorString);
Save Conditionals.jspp to your Conditionals folder. Then create a second file named “Conditionals.html” and write in the following:
<!DOCTYPE html> <title>Conditionals program</title> <body> <p id="content"></p> <script src="http://code.jquery.com/jquery-1.12.4.min.js"></script> <script src="Conditionals.jspp.js"></script> </body> </html>
Save Conditionals.html to your Conditionals folder. Compile Conditionals.jspp and then open Conditionals.html in a browser. If everything has worked, your document should display “red” in a red font.
“if”, “else”, and “else if”
Conditionals.jspp shows the syntax of a simple if
statement: the keyword if
itself, followed by a pair of parentheses holding a condition to check, followed by a block of code in curly braces which executes if and only if the condition is true.
Note: the curly braces around the code block are optional if the block only contains one statement. For consistency and readability, however, it is advisable always to use curly braces.
Although if
statements are often used on their own, they are also commonly used together with else
statements. Let’s add an else
statement to Conditionals.jspp:
external $; string colorString; bool likesRed = true; if (likesRed) { colorString = "red"; } else { colorString = "blue"; } $("#content").text(colorString); $("#content").css("color", colorString);
Compile this code and then open Conditionals.html in a browser. The result is the same: the document still displays “red” in a red font. The reason is that the code in an else
block only executes if the condition in the associated if
statement is false. To get the code in your else
block to execute, change the value of likesRed
to false
: Conditionals.html will then display “blue” in a blue font.
Notice that the else
statement doesn’t specify a condition of its own; the only condition that is checked in Conditionals.jspp is likesRed
. We simply have one block of code which executes if that condition is true, and another block which executes if it is false.
In some cases, however, we want the execution of our code to depend on more than one condition. This is where else if
statements can prove useful. An else if
statement supplies a condition of its own and an associated code block. The code block executes if the condition is true and all previous conditions (i.e. those associated with earlier if
and else if
statements) are false. Let’s revise Conditionals.jspp again to show the use of an else if
statement:
external $; string colorString; bool likesRed = false; bool likesBlue = true; if (likesRed) { colorString = "red"; } else if (likesBlue) { colorString = "blue"; } else { colorString = "green"; } $("#content").text(colorString); $("#content").css("color", colorString);
Here the code in the else if
block will execute, since its likesBlue
condition is true whereas the likesRed
condition specified by the earlier if
statement is false. If we change the value of likesBlue
to false, however, the code in the else if
block will not execute, but the code in the else
block will. Play around with the values of likesRed
and likesBlue
for yourself to see what effect they have on the conditional’s execution.
Contact Us