# JavaScript switch Statement: Syntax, Cases, and Break Source: https://devdocs10.com/articles/javascript/js-switch By Murat Bo · Published 2026-07-02 · DevDocs10 (https://devdocs10.com) The `switch` statement gives you a clean way to run different blocks of code based on one value. It is useful when you want to compare the same expression against several possible matches without writing a long chain of `if` and `else if` statements. > **Quick answer:** Use `switch` when one value needs to be checked against many exact matches. Each `case` compares with strict equality, and `break` stops execution from falling through to the next case. > **Difficulty:** Beginner > > **You'll understand this better if you know:** basic JavaScript variables, boolean conditions, and how `if` statements work. ## 1. What Is switch? The `switch` statement is a control-flow structure that chooses one path from many possible paths. It evaluates a single expression once, then compares that result against each `case` label until it finds a match. - It is built for exact value matching. - It makes repeated comparisons against one expression easier to read. - It can include a `default` branch for unmatched values. - It can intentionally fall through to later cases when you omit `break`. In practice, `switch` is most often used for menu choices, command handling, state changes, and mapping a small set of known values to different actions. ## 2. Why switch Matters `switch` matters because it improves readability when one value drives several possible outcomes. Instead of repeating the same variable in many comparisons, you can group the outcomes in a structure that is easier to scan. It is especially helpful when: - You compare one value to many known constants. - You want each branch to be clearly named with a case label. - You need intentional fall-through behavior for related cases. - You want a `default` branch for unexpected values. It is less suitable when you need range checks, complex boolean logic, or conditions based on different variables. In those situations, `if` statements are usually clearer. ## 3. Basic Syntax The basic structure of `switch` is simple: evaluate one expression, compare it to each case, run the matching block, and stop with `break` unless you want fall-through. ### Minimal syntax The example below shows the core shape of a switch statement. ```css switch (expression) { case "value1": // code for value1 break; case "value2": // code for value2 break; default: // code when no case matches } ``` Here, `expression` is evaluated once. Each `case` is a possible match, and `default` runs when no case matches. The `break` statement prevents execution from continuing into the next case. ### How matching works JavaScript compares the switch value to each case using strict equality rules. That means both type and value must match. ```javascript const value = 1; switch (value) { case "1": console.log("string one"); break; case 1: console.log("number one"); break; } ``` Output (tested with Node 24.21.0): ```text number one ``` This prints `number one` because the number `1` does not match the string `"1"`. ## 4. Step-by-Step Examples ### Example 1: Choosing a day label This example maps a numeric day value to a readable label. ```javascript const day = 3; let name; switch (day) { case 1: name = "Monday"; break; case 2: name = "Tuesday"; break; case 3: name = "Wednesday"; break; default: name = "Unknown"; } console.log(name); ``` Output (tested with Node 24.21.0): ```text Wednesday ``` Because `day` is `3`, the third case runs and sets `name` to `Wednesday`. ### Example 2: Handling a command Switch is useful when one value selects an action, such as a command name. ```javascript const command = "save"; switch (command) { case "save": console.log("Saving file..."); break; case "open": console.log("Opening file..."); break; case "close": console.log("Closing file..."); break; default: console.log("Unknown command"); } ``` Output (tested with Node 24.21.0): ```text Saving file... ``` This pattern is easy to read because each command has its own named branch. ### Example 3: Grouping multiple cases You can place multiple case labels before the same block when several values should share the same result. ```javascript const status = "warning"; switch (status) { case "info": case "warning": console.log("Show a non-critical message"); break; case "error": console.log("Show an error message"); break; } ``` Output (tested with Node 24.21.0): ```text Show a non-critical message ``` Both `info` and `warning` run the same block, which avoids repeating code. ### Example 4: Intentional fall-through Sometimes you want a case to continue into the next one. This is called fall-through and should be used deliberately. ```javascript const level = "admin"; switch (level) { case "guest": console.log("Read-only access"); break; case "admin": console.log("Full access"); // no break on purpose default: console.log("Audit logging"); } ``` Output (tested with Node 24.21.0): ```text Full access Audit logging ``` Because there is no `break` after `admin`, execution continues into `default`. This can be useful, but it is also a common source of bugs when accidental. ## 5. Practical Use Cases - Menu selection in command-line or browser-based interfaces. - Mapping numeric codes to labels, such as status codes or weekday numbers. - Handling application states like `idle`, `loading`, `success`, and `error`. - Choosing messages or actions based on a known string command. - Applying different logic for a small set of fixed categories, such as user roles or payment methods. If the choices are stable and limited, `switch` often reads better than many repeated comparisons. ## 6. Common Mistakes ### Mistake 1: Forgetting break and causing unintended fall-through A very common bug is leaving out `break` when you meant to stop after the first matching case. **Problem:** Without `break`, JavaScript continues into the next case and runs extra code that you did not intend. ```javascript const role = "editor"; switch (role) { case "editor": console.log("Can edit content"); case "viewer": console.log("Can view content"); } ``` Output (tested with Node 24.21.0): ```text Can edit content Can view content ``` **Fix:** Add `break` after each branch unless you want fall-through. ```javascript const role = "editor"; switch (role) { case "editor": console.log("Can edit content"); break; case "viewer": console.log("Can view content"); break; } ``` Output (tested with Node 24.21.0): ```text Can edit content ``` The corrected version works because execution stops after the matching branch runs. ### Mistake 2: Using the wrong type in a case label `switch` uses strict equality, so numbers do not match strings that look the same. **Problem:** The value `2` does not match `"2"`, so the wrong branch runs or `default` is used unexpectedly. ```javascript const month = 2; switch (month) { case "1": console.log("January"); break; case "2": console.log("February"); break; default: console.log("Unknown month"); } ``` Output (tested with Node 24.21.0): ```text Unknown month ``` **Fix:** Make sure the case values use the same type as the switch expression. ```javascript const month = 2; switch (month) { case 1: console.log("January"); break; case 2: console.log("February"); break; } ``` Output (tested with Node 24.21.0): ```text February ``` The fixed version works because the values now match both in type and in content. ### Mistake 3: Expecting switch to evaluate conditions A `switch` statement does not test arbitrary conditions in each case label. Each case is a value to compare, not a full boolean expression workflow. **Problem:** Writing conditions like `case score >= 90` does not work the way many beginners expect, because the switch expression is compared to the case result, which is `true` or `false`. ```javascript const score = 92; switch (score) { case score >= 90: console.log("A"); break; default: console.log("Needs another approach"); } ``` Output (tested with Node 24.21.0): ```text Needs another approach ``` **Fix:** Use `if` statements for range checks and other boolean conditions. ```javascript const score = 92; if (score >= 90) { console.log("A"); } else if (score >= 80) { console.log("B"); } ``` Output (tested with Node 24.21.0): ```text A ``` The corrected version works because `if` is designed for conditions, while `switch` is designed for exact matching. ## 7. Best Practices ### Practice 1: Use switch for exact matches only `switch` is best when you already know the exact values you want to handle. That keeps the code easy to read and avoids awkward workarounds. ```javascript const mode = "dark"; switch (mode) { case "light": console.log("Use light theme"); break; case "dark": console.log("Use dark theme"); break; } ``` Output (tested with Node 24.21.0): ```text Use dark theme ``` This is a good fit because the branch names match the actual values. ### Practice 2: Keep shared logic inside one case block If multiple values do the same thing, place them together rather than duplicating code. ```javascript const permission = "moderator"; switch (permission) { case "admin": case "moderator": console.log("Can manage content"); break; case "member": console.log("Can view content"); break; } ``` Output (tested with Node 24.21.0): ```text Can manage content ``` This makes the shared behavior obvious and reduces repetition. ### Practice 3: Use default for unexpected values A `default` branch helps you handle unknown input safely. ```javascript const paymentMethod = "cash"; switch (paymentMethod) { case "card": console.log("Process card payment"); break; case "paypal": console.log("Process PayPal payment"); break; default: console.log("Unsupported payment method"); } ``` Output (tested with Node 24.21.0): ```text Unsupported payment method ``` This helps prevent silent failures when the input is not one of the values you expected. ## 8. Limitations and Edge Cases - `switch` compares with strict equality, so matching is exact and type-sensitive. - Case labels are checked in order, and the first match wins. - Duplicate case labels are confusing and should be avoided because only the first matching path matters. - Fall-through can be useful, but accidental fall-through is one of the most common bugs. - `default` can appear anywhere in the statement, not just at the end, although putting it last is usually clearer. - `case` labels are expressions, but they should still produce fixed values that make sense for exact comparison. - For range checks, pattern matching, or multiple unrelated conditions, `if` statements are a better fit. A common surprise is that `switch` does not behave like pattern matching in some other languages. It is a straightforward exact-match dispatcher, not a general-purpose condition matcher. ## 9. Practical Mini Project Here is a small but complete example: a simple text-based menu handler that chooses an action from a command string. It shows how `switch` can organize several related branches cleanly. ```javascript const command = "help"; let message; switch (command) { case "start": message = "Starting the app..."; break; case "stop": message = "Stopping the app..."; break; case "help": message = "Available commands: start, stop, help"; break; default: message = "Unknown command"; } console.log(message); ``` Output (tested with Node 24.21.0): ```text Available commands: start, stop, help ``` This example works because each command maps to exactly one output string, and `default` handles any unsupported command. ## 10. Key Points - `switch` is best for exact matching against one expression. - Each `case` uses strict equality, so type matters. - `break` prevents unwanted fall-through. - `default` is your fallback when no case matches. - Use `if` statements when you need conditions, ranges, or complex logic. ## 11. Practice Exercise - Create a variable named `grade` with one of these values: `"A"`, `"B"`, `"C"`, or `"F"`. - Use `switch` to print a different message for each grade. - Add a `default` branch for unexpected values. **Expected output:** A message that matches the grade value, or a fallback message for anything else. **Hint:** Keep the case labels as strings, and include `break` after each branch. **Solution:** ```javascript const grade = "B"; switch (grade) { case "A": console.log("Excellent work"); break; case "B": console.log("Good job"); break; case "C": console.log("You passed"); break; case "F": console.log("You need to retake the test"); break; default: console.log("Invalid grade"); } ``` Output (tested with Node 24.21.0): ```text Good job ``` This solution uses one switch statement to handle several exact string values clearly and safely. ## 12. Final Summary The JavaScript `switch` statement is a readable way to choose between several exact matches for one value. It works well for commands, categories, states, and other situations where a single expression should lead to one of many branches. To use it correctly, remember that case matching is strict, `break` prevents accidental fall-through, and `default` gives you a safe fallback. If your logic depends on ranges or complex conditions, choose `if` statements instead. As you practice, focus on the difference between exact matching and condition checking. Once that distinction is clear, `switch` becomes a reliable tool for organizing control flow in JavaScript.