Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Parenthesis Question

if ((a < b || c > d) || c === e) { alert("text"); } Why would the code above be wrong?

Really struggling with ( ) positioning

The correct way is :- if (a < b || (c > d || c ===e)) { alert("text"); } But how does someone know where to put ( )?

6 Answers

Jennifer Nordell
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

Hi there, jasonj7! Joseph Yhu is spot on. In this case, you've created a condition where the placement of the parentheses don't actually matter. However, there are cases where it does matter and quite a bit. Typically, you see this a lot with conditions that combine the || and the &&.

Take a look at the following example:

let a = 2;
let b = 20;
let c = 30;


if((a == 10 && b == 20) || c == 30) {
  console.log("First condition evaluates to true.");
} else {
  console.log("First condition evaluates to false.");
}

if(a == 10 && (b == 20 || c == 30)) {
  console.log("Second condition evaluates to true.")
} else {
  console.log("Second condition evaluates to false.")
}

The output:

First condition evaluates to true.
Second condition evaluates to false.

They are the same barring the placement of the inner parentheses. I'm not sure if you remember from your math classes learning to do everything in parentheses first. This also goes for nested parentheses. The further in it is, the higher priority. So in the first if statement we start by doing the a==10 && b==20 which evaluates to false. Then we do the "or c is equal to 30" and it is, so it evaluates to true.

In the second example, however, we start with the b == 20 || c==30 part which evaluates to true. Then we ask if a == 10 and the result of b == 20 || c ==30, which evaluates to false. It's about the order in which you want to evaluate the truthiness of something.

Hope this helps! :sparkles:

edited for additional information

The first one would look like this if you follow the evaluation step by step:

(a == 10 && b == 20) || c == 30
false || c == 30
false || true
true

And the second one would look like:

a == 10 && (b == 20 || c == 30)
a == 10 && true
false && true
false

I know your both right, I'm going to go and read through what you've posted, thank you Jennifer Nordell and Joseph Yhu. I have struggled with JavaScript on web development, so i have switched to learn just JavaScript and I appreciate you help. Treehouse Teacher

This: (a < b || (c > d || c === e) has 2 opening parentheses but only 1 closing parenthesis.

sorry Joseph Yhu I have amended the question

Is this part of a code challenge?

Its not part of any code challenge i'm aware of

Where does it say that the first one is wrong? Both should work.

Oh ok, so does the layout (or the use of parenthesis) depend on what result is required?

Both should give you the same result, you can check it by creating a truth table. In fact, I did it myself. Although a < b || c > d will give you a different result than c > d || c === e, the overall results (i.e. (a < b || c > d) || c === e and a < b || (c > d || c === e)) should be the same.

So if you move the ( ) around it does definitely give a different result. thanks for your help.