Home > mobile app development, SD in general, The How > A (slightly) better switch statement in JavaScript

A (slightly) better switch statement in JavaScript

The switch statement in JavaScript suffers from the usual problems associated with C-style switch statements: fall through. This means that each case guard needs to be expressly closed with a break statement to avoid falling through to the first executable code after that – no matter which case that code belongs to. Fall through has been the source of very many bugs. Unfortunately, the static code analysis for JavaScript (JSLint, JSHint and Google’s Closure compiler) do not check for potential fall through (yet?).

Today I thought I could improve the switch statement slightly with the following code pattern:

var result = (function(it) {
switch(it) {
case 'x': return 1;
case 'y': return 2;
/* ... */
default: return 0;

(Apologies for the lack of indentation: couldn’t get that to work…)

The advantage of using return statements is two-fold:

  1. it exits the switch statement immediately,
  2. it usually comes right after the case guard, making visual inspection and verification much easier than hunting for a break either in- or outside of a nice pair of curly braces.

This approach also has a definite functional programming flavor, as we’ve effectively turned the switch statement into an expression, since the switch statement is executed as part of a function invocation.


Yes, I do write JavaScript from time to time. I usually don’t like the experience very much, mostly because of inadequate tool support and the lack of static typing (and the combination thereof: e.g. the JS plug-ins for Eclipse often have a hard time making sense of the code at all). But we do what we can to get by 😉

  1. Jups
    November 16, 2012 at 9:07 am

    Useful post, although having the option of leaving out the break is sometimes pretty useful too. Consider cases x and y and statements A and B. If it is desired that B is executed at case y and that A ánd B are executed at case x, the break line can be omitted at case x.

    Ever tried CoffeeScript? Beautiful python-style no-nonsense syntax alternative that compiles to Javascript. And they have a break-less switch statement: http://coffeescript.org/#switch

    • November 16, 2012 at 9:28 am

      In the situation you describe, I’d rather put the statement(s| block) inside a separate function and explicitly invoke-and-return it for both cases. Especially JavaScript is good for this as you can write that separate function inside the lexical context which contains the switch. The reason is that you the reader of that code still has to become aware of the absence of the return and draw the conclusion that the same happens for both cases, whereas with the slight duplication you can simply look up the corresponding case and see what it does without having the consider either the next or previous lines. Moreover, by giving the function an appropriate name you actually make the semantics of the code more explicit which is usually a win.

      I know CoffeScript, but haven’t used it mainly because the syntax is a bit too efficient for my taste. Syntax works as a visual cue-of-sorts, meaning that your eyes (OK, brain, actually) have something to latch on to and CoffeeScript manages to feel quite “slippery” because of that. Mind that I have a degree in mathematics so I’m quite used to minimalistic notation/syntax. A nice example where the conciseness is above the minimum threshold (at least for me), is Xtend which is a Java replacement: it retains quite a fair amount of the Java syntax but without the (well-known) noise.

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: