Simplifying Switch statement and Template Literal in Javascript.

Hello everyone! My apologies for the late update. Been a while. That said, let’s get started with ‘Switch Statements in JavaScript’.

The switch statement allows the execution of one code from different expressions. It evaluates an expression and executes a code block based on the value of that expression. It is similar to if/else statements, however it allows us to evaluate an expression against multiple possible values.

Each value in a switch statement is called a case, and each case has its own code block. The switch statement ends with a default case that executes if none of the other cases match the expression.

N.B: Once we match the case, it will bring all the console in output, however if it doesn’t match the case it simply goes to the last variable and print it .

Example:

let day = "Sunday"

switch(day) {
    case   'Monday':
               console.log("7am");
    case   'Tuesday':
               console.log("4am");
    case   'Wednesday':
               console.log("4am");
    case   'Thursday':
               console.log("4am");
    case   'Friday':
               console.log("9am");
    case   'Saturday':
               console.log("8am");
    case   'Sunday':
               console.log("8am");

} 
                                 //8am

What if we switch the case to Monday?

let day = "Monday"

switch(day) {
    case   'Monday':
               console.log("7am");
    case   'Tuesday':
               console.log("4am");
    case   'Wednesday':
               console.log("4am");
    case   'Thursday':
               console.log("4am");
    case   'Friday':
               console.log("9am");
    case   'Saturday':
               console.log("8am");
    case   'Sunday':
               console.log("8am");
 
            }
                  //7am 4am 4am 4am 9am 8am 8am
                  

This is tricky because the output shows all the time in the cases. In the previous example, the switch cause tries to match with Saturday ‘8am’ and Sunday ‘8am’. It discovers the equation focused on Sunday, so it printed 8am.

However, for this example, it matches at the start itself — Monday ‘7am’. Thus, it simply fall through and prints all the consoles because it matches from the beginning. To resolve this , we use the ‘break’ function.

The Break keyword

The break keyword ends the switch block when it’s reached. We don’t need to use break for the last case, because the block ends automatically at that point.

Example:

let day = "Monday"

switch(day) {
    case   'Monday':
               console.log("7am");
               break;
    case   'Tuesday':
               console.log("4am");
    case   'Wednesday':
               console.log("4am");
    case   'Thursday':
               console.log("4am");
    case   'Friday':
               console.log("9am");
    case   'Saturday':
               console.log("8am");
    case   'Sunday':
               console.log("8am");
 
            }
                               //7am

Using break, output becomes 7am.

For similar consoles, we can group into one break. Also, we don’t have to mention ‘break’ at the end.

Example:

let day = "Wednesday"

switch(day) {
    case   'Monday':
               console.log("7am");
               break;
    case   'Tuesday':
    case   'Wednesday':
    case   'Thursday':
               console.log("4am");
               break;
    case   'Friday':
               console.log("9am");
               break;
    case   'Saturday':
    case   'Sunday':
               console.log("8am");
 
    }
    console.log("Bye");          
                       //4am Bye

What if we enter a day that isn’t included in the cases? For instance, ‘let day = Holiday’

Here, we simply use the ‘default keyword.’

The Default Keyword

The default keyword specifies the code to run if none of the cases match the expression. It is a good way to provide a fallback option if the other cases don’t cover all the possible values of the expression.

Example:

let day = "Holiday"

switch(day) {
    case   'Monday':
               console.log("7am");
               break;
    case   'Tuesday':
    case   'Wednesday':
    case   'Thursday':
               console.log("4am");
               break;
    case   'Friday':
               console.log("9am");
               break;
    case   'Saturday':
    case   'Sunday':
               console.log("8am");      
               break;
    default: 
               console.log("12pm");
 
    }
    console.log("Bye");       
                            //12pm Bye

Template Literal in Javascript

let num1 = 3
let num2 = 5

let result = num1 + num2

console.log(`the addition of ${num1} and ${num2} is ${result}`); 
   
         //the addition of 3 and 5 is 8

console.log(`I am 
Aisha Wahab`);

            //I am
              Aisha Wahab

In essence, template literals are a special type of string in Javascript that use special characters and expressions inside of them. They’re really useful for creating dynamic strings that can change based on the information we have. For instance, as seen in the above example, we could use a template literal to create a name tag that changes depending on the person’s name. The back tick (` `) characters allows for multi line strings as well.

The dollar sign and curly braces in a template literal are used insert the value of an expression. The expression can be a number, string, variable, or function. It’s kind of like using a placeholder that gets filled in with the correct value.

See you soon!