95 lines
3.6 KiB
Markdown
95 lines
3.6 KiB
Markdown
---
|
|
title: Switch Statements
|
|
---
|
|
## Switch Statements
|
|
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
|
|
A `switch` statement in programming is similar to an `if-else` statement, but has the benefit of sometimes being easier to read when there are a lot of conditions. Also it allows a `default` block to be added that will be executed if none of the other conditions are true.
|
|
|
|
### Syntax:
|
|
```javascript
|
|
switch(expression) {
|
|
case 1:
|
|
console.log('1');
|
|
break;
|
|
case 2:
|
|
console.log('2');
|
|
break;
|
|
default:
|
|
console.log('No true condition, default');
|
|
}
|
|
```
|
|
|
|
The above snippet shows the syntax for a basic `switch` statement. In this example, there are 3 different scenarios for:
|
|
- `expression = 1`: First condition is true, and `1` gets printed to the console.
|
|
- `expression = 2`: Second condition is true, and `2` gets printed to the console.
|
|
- `expression = 'anything else'`: Case 1 and Case 2 are both false, so the default condition is executed.
|
|
|
|
The `default` condition is a condition that will be executed if none of the other cases are true.
|
|
|
|
|
|
Note: One really important point to note here is that in the snippet above, `case 1:` and `case 2:` might seem to represent some kind of order, but `1` and `2` are nothing but the answers which the `(expression)` may get evaluated to. So therefore instead of 1 and 2 it can be anything which the `(expression)` may evaluate to and can be tested against.
|
|
|
|
For example:
|
|
```javascript
|
|
var someValue;
|
|
var expression = someValue;
|
|
switch(expression){
|
|
case someValue:
|
|
console.log('10'); // 10 would be printed to the console
|
|
break;
|
|
case 23:
|
|
console.log('12');
|
|
break;
|
|
default:
|
|
console.log('No matches');
|
|
}
|
|
```
|
|
|
|
Note: `expression` in the snippet above can be a string or number.
|
|
|
|
|
|
### Break
|
|
The `break` keyword is required in each case to make sure that only the code in that case gets executed. Without the break, multiple cases could be executed. When JavaScript reaches a `break` keyword, it breaks out of the switch block. If the `break` was left out of the above example, this is what would happen:
|
|
|
|
```javascript
|
|
var expression = 1;
|
|
switch(expression) {
|
|
case 1:
|
|
console.log('1'); // 1 would be printed to console
|
|
case 2: // As there is no break after case 1, this case is also executed.
|
|
console.log('2'); // 2 would be printed to the console.
|
|
break; // break -> Switch statement is exited
|
|
default:
|
|
console.log('No true condition, default');
|
|
}
|
|
```
|
|
|
|
|
|
### Execute multiple cases:
|
|
`switch` statements also allow for the same code block to be executed by multiple cases. This can be done by adding 1 or more `case :` keywords before a code block.
|
|
|
|
Eg:
|
|
```javascript
|
|
switch (day) {
|
|
case 4:
|
|
case 5:
|
|
console.log('it is nearly the weekend');
|
|
break;
|
|
case 0:
|
|
case 6:
|
|
console.log('it is the weekend');
|
|
break;
|
|
default:
|
|
console.log('Looking forward to the Weekend');
|
|
}
|
|
```
|
|
|
|
In the above snippet:
|
|
- If `day` is `4` or `5` (Thursday or Friday), `it is nearly the weekend` will be printed to the console as the first case gets executed.
|
|
- If `day` is `0` or `6`, (Saturday or Sunday),`it is the weekend` will be printed to the console as the second case gets executed.
|
|
- If `day` is any other value, `Looking forward to the Weekend` will be printed to the console, as the default case gets executed.
|
|
|
|
### More Information:
|
|
<!-- Please add any articles you think might be helpful to read before writing the article -->
|
|
<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch' target='_blank' rel='nofollow'>MDN Documentation for switch</a>
|