Is a reversed switch statement acceptable JavaScript?

Question

JSLint is complaining that (true) is a weird condition. Which is understandable if I wasn't using it on a reversed switch statement. So is JSLint wrong or should I not be using reversed switch statements?

Thanks for any help/enlightenment.

switch (true) {
    case (menuLinksLength < 4):
        numberOfColumns = 1;
        break;
    case (menuLinksLength > 3 && menuLinksLength < 7):
        numberOfColumns = 2;
        break;
    case (menuLinksLength > 6 && menuLinksLength < 10):
        numberOfColumns = 3;
        break;
    case (menuLinksLength > 9):
        numberOfColumns = 4;
        break;
    default:
        numberOfColumns = 0;
}

Orten

For what it's worth, you can keep your reversed switch statement and still satisfy the linter if you use switch(true===true). This is not an endorsement of the practice ;) – Whelan

switch(true===true) doesn't help, as that then causes it to complain about a "Weird relation." – Stalag

var theTruth = true; ----- switch(theTruth) {...} – Hoe

Answer 1

The third edition of the ECMA-262 standard (supported by Firefox 1.0+, Google Chrome 1.0+, MSIE 5.5+ and others) defines that

switch (expression) {
    case label1:
        statements1
    .
    .
    .
}

executes statements1 if (expression) matches label1.

That means that your switch statement is perfectly fine.

I tried it out on Firefox, Chrome and IE. None complains...

Edit:

Now the guessing part:

JSLint is a code anaylisis tool. When it sees switch (true), it assumes that you don't know what you're doing. Weird doesn't mean necessarily wrong...

Oletaoletha

The reason it's causing me a problem is because the company I work for use it in their build scripts and it fails when JSLint returns 'weird'. I don't know how the errors are classed in JSLint but I guess it might not be it's fault. Thanks for the help. – Orten

No way to disable this check then? – Neutron

@Danny: No clue. I've never used JSLint. – Oletaoletha

Leaving this question here for anyone who might know: How to disable the Weird Condition check in JSLint? – Neutron

Answer 2

Personally I wouldn't like seeing reversed switch in a code base. It doesn't buy you anything when compared to a plain if/elseif block, and its exotic nature can be cause for confusion.

That's also what JSLint is complaining about:

You are doing something unorthodox. Is there a good reason for it? If not, it might be better to stick to the basics.

Lovely

I know it's all personally preference. But personally I find a mass of if statements far messier. – Orten

But that's the whole point of JSLint. It advises you not just of illegal code, but also of poor coding practices. And this "reversed switch" is a great example of "clever" code (i.e., code that future changes will probably break, and which isn't particularly readable). – Axle

Answer 3

numberOfColumns = Math.max(4, Math.floor(menuLinksLength / 3));

This will give you identical results to your existing code. Your question is fairly ambiguous, as "acceptable" is a very subjective term. I would personally reject any merge request with a reversed switch statement, because I actually can't think of a situation where that couldn't be replaced with something simpler and/or easier to read.

Subway

Answer 4

Whether or not a "reverse switch" is considered good practice in javascript depends on the specific use case.

In general, a reverse switch can make the code more readable and maintainable by clearly defining the intended behaviour for cases that don't match a specific pattern. This can be useful in situations where you want to catch all edge cases or exceptions that are not explicitly defined in the switch statement.

Philippi