Javascript Switch Statement

17.7.6    Multiple Branching via “switch”

switch( expression ) { case label_1 : statements; [ break ]; case label_2 : statements; [ break ]; ... default : statements; }

switch ( new Date().getDay()) { case 0: console .log( "Today is Sunday" ); break ; case 6: console .log( "Today is Saturday" ); break ; default : console .log( "Today is an ordinary weekday" ); }

This means: “If the conditions specified are met, run the first block of code; otherwise run the second block.” The syntax follows: if ( condition ){ //code to be executed if condition is true } else{ //code to be executed if condition is false } Returning to the previous example, you can write Good Morning if the time is before noon, and Good Afternoon if it is after noon ( ch10_eg05.js). var date = new Date(); var time = date.getHours(); if ( time < 12 ) { document.body.innerHTML += '

Good Morning

'; } else { document.body.innerHTML += '

Good Afternoon

'; } As you can imagine there are a lot of possibilities for using conditional statements. switch Statements A switch statement enables you to deal with several possible results of a condition. You have a single expression, which is usually a variable. This is evaluated immediately. The value of the expression is then compared with the values for each case in the structure. If there is a match, the block of code executes. Here is the syntax for a switch statement: switch ( expression ){ case option1: //code to be executed if expression is what is written in option1 break; case option2: //code to be executed if expression is what is written in option2 Conditional Statements ❘ 359 break; case option3: //code to be executed if expression is what is written in option3 break; default: //code to be executed if expression is different from option1, option2, and option3 } You use the break to prevent code from running into the next case automatically. For example, you might check what type of animal a user has entered into a textbox, and you want to write out dif- ferent things to the screen depending upon what kind of animal is in the text input.

Think of a switch statement as a waterfall. It will go through everything unless you apply an obstruction (break) in between.

Looping in JavaScript

1. Initialize a variable with a value.
2. Test that value.
3. Execute if true, quit if false.

for(var i=0; i<100; i++) { console.log(i); }	var i=0; while(i<100) { console.log(i); i++; }	var i=0; do { console.log(i); i++ } while(i<100);
In a for loop, the keyword for is followed by three expressions inside parentheses, separated by semicolon (;). The first expression initializes the value, the second expression sets the condition, and the third expression updates the value. After the statements inside the curly braces are updated, the value is updated by the third expression. As long as the result of the condition expression is true, the statements inside the curly braces will be executed. If the result of the condition becomes false, the code will break out of the for loop.	In a while loop, the variable is initialized outside the actual looping statement. The keyword while

switch(expression){    case expression_value:             //Optional statement(s)          break; //optional            case expression_value:            //Optional statement(s)          break; //optional            default:             //Statement(s)             } Figure 3.8: Switch statement flowchart

Exercise 3.08: Writing a switch Statement and Testing It

1. Open the switch-statement.html document in your web browser.
2. Open the web developer console window using your web browser.
3. Open the switch-statement.js document in your code editor, replace all of its content with the following code, and then save it:var keyNames = "WASDwasd"; var keyName = keyNames.charAt(Math.floor(Math.random() * keyNames.length)); console.log("keyName:", keyName);
   The Math.floor(Math.random() * keys.length) expression is selecting a number from 0 to 7 that is then used by charAt to select the character from the keyNames string variable.
4. Run a few tests by reloading the switch-statement.html web page in your web browser with the console window open. Your results will show selections from the ADWSadws characters. Here are some examples of the console output:keyName: a keyName: S

1. Open a text editor of your choice and enter the following HTML and JavaScript code: <!doctype html> <body> <h1>Switch Statement example</h1> <p>Switch Statement example</p> <script> var objDay = new Date(); switch (objDay.getDay()) { case 0: console.log(“Sunday”); break; case 1: console.log(“Monday”); break; case 2: console.log(“Tuesday”); break; case 3: console.log(“Wednesday”); break; case 4: console.log(“Thursday”); break; case 5: console.log(“Friday”); break; case 6: console.log(“Saturday”); break; default: console.log(“Choose a proper day value”); break; } </script> </body> </html>
2. Save the file with an HTML extension, for example Chapter 13.4.html .
3. Double-click the file to open it in the default browser.

Because a switch statement will run any statements within any case clause after a clause that evaluates to true, unpredictable results can occur when you forget a break statement. Problems caused by missing break state- ments are not easy to identify because they generally won’t produce errors, but will frequently produce incorrect results. If no match is found in any of the case clauses, the switch statement will look for a default clause and execute the statement it contains. The exception to the rule that you should always use a break statement between case clauses is the default clause. As long as the default clause is the last state- ment in your switch (which it should be), you can safely omit the break after it because the program will break out of the switch after the last statement anyway. Listing 6-1 shows an example of how you might use a switch statement. LISTING 6-1: Using a switch Statement to Personalize a Greeting let languagePreference = "Spanish"; switch (languagePreference){ case "English": console.log("Hello!"); break; case "Spanish": console.log("Hola!"); break; case "German": console.log("Guten Tag!"); break; case "French": console.log("Bon Jour!"); break; default: console.log("I'm Sorry, I don't speak" + languagePreferance + "!"); } 246 BOOK 3 Advanced Web Coding Here We Go: Loop De Loop Loops execute the same statement multiple times. JavaScript has several different types of loops: » for » for ... in » do ... while » while for loops The for statement creates a loop using three expressions: » Initialization: The initial value of a variable, typically a counter. » Condition: A Boolean expression to be evaluated with each iteration of the loop. » Final expression: An expression to be evaluated after each loop iteration. Although it’s not required to use all three expressions in a for loop, all three of them are nearly always included. The for loop is usually used to run code a pre- determined number of times.