-4

JSLint gives me the following error :

The '&&' subexpression should be wrapped in parens.

Here is the line which causes problem:

if (anchorLink === 'page1' || anchorLink === 'page2' || anchorLink === 'page3' && (!$('#myDiv').hasClass('boom'))) { /* stuff */ }

I'm sorry for asking this because a very similar, almost identical question was asked here, but I've tryed different ways of wrapping that && condition , I can't make it work. Any help for the correct syntax would be really appreciated.

Community
  • 1
  • 1
mlclm
  • 725
  • 6
  • 16
  • 38
  • 2
    @mlclm - See [this article](http://jslinterrors.com/the-subexpression-should-be-wrapped-in-parens) for an explanation of the error. That site attempts to give explanations and solutions for all of the JSLint error messages. – James Allardice Jul 05 '14 at 13:15
  • Thanks a lot for the link! very useful, bookmarked. – mlclm Jul 05 '14 at 15:32

3 Answers3

3

The point is, you are currently reliying on operator precedence. Basically you have an implicit parenthesization:

anchorLink === 'page1' || anchorLink === 'page2' || (anchorLink === 'page3' && !$('#myDiv').hasClass('boom'))

which might or might not be what you want.

For example, you might mean this instead:

(anchorLink === 'page1' || anchorLink === 'page2' || anchorLink === 'page3') && !$('#myDiv').hasClass('boom')

To avoid ambiguity, JSLint is suggesting to put explicit parenthesis in your condition.

mlr
  • 886
  • 6
  • 15
  • 1
    Thank you for showing me and explaining the solution . I'm new to jQuery so I'm slowly learning. – mlclm Jul 05 '14 at 09:22
  • 1
    No problem, we've all been there once! :D Careful though: this is something valid across JavaScript, not just jQuery. – mlr Jul 05 '14 at 09:26
3

Put parentheses around all the anchorLink conditions if they're supposed to be independent of the hasClass condition.

if ((anchorLink === 'page1' || anchorLink === 'page2' || anchorLink === 'page3')
    && (!$('#myDiv').hasClass('boom'))) { /* stuff */ }

If you only want the hasClass condition to be combined with page3, then it should be:

if (anchorLink === 'page1' || anchorLink === 'page2' ||
    (anchorLink === 'page3' && (!$('#myDiv').hasClass('boom')))) { /* stuff */ }

The second version is the interpretation you'll get if you leave out the parentheses, because && has higher precedence than ||. This is a common mistake (the first meaning is more likely to be what you intended), which is the reason why JSLint warns about it.

Barmar
  • 741,623
  • 53
  • 500
  • 612
  • Thank you very much for your explanation...makes sense. I'm new to jQuery to learning alot of usefull stuff slowly. – mlclm Jul 05 '14 at 09:13
  • 2
    This has nothing to do with jQuery, it's not even specific to Javascript. It's the same issue in most programming languages, like C and PHP. – Barmar Jul 05 '14 at 09:17
2

I assume you need to also wrap the condition before the && to disambiguate the expression:

if ((anchorLink === 'page1' || anchorLink === 'page2' || anchorLink === 'page3') && (!$('#myDiv').hasClass('boom'))) { /* stuff */ }
sdabet
  • 18,360
  • 11
  • 89
  • 158
  • +1, but the parens around `!$('#myDiv').hasClass('boom')` are completely pointless. – T.J. Crowder Jul 05 '14 at 09:09
  • Nice one, thanks a lot... I hadn't tryed that. Thanks for your help @fiddler, really appreciated. It works. – mlclm Jul 05 '14 at 09:09
  • @ T.J. Crowder No need to downvote my question... ? the f ? – mlclm Jul 05 '14 at 09:10
  • 1
    @mlclm: People downvote, and people comment. They're frequently not the same people. If you assume you know who downvoted a question/answer, you'll be wrong much more often than right. – T.J. Crowder Jul 05 '14 at 16:19
  • Yea you are right, I don't know who downvoted, sorry for pointing my finger at you so quickly (because the downvote happened at the same time you answered my problem), I was wrong . I wasn't expecting any downvotes because there's no reason for that in my question. Anyways, I guess there will always be idiots out there to mess around for "fun". But thanks again for your help about my js problem, I really appreciated that, that's what is important. Furthermore I think my question will help other users to understand that JSLiint error and how to resolve it in the future, so that's a good thing. – mlclm Jul 05 '14 at 19:49