2

I see in the code I am working on often the following code style;

var1 == true && (var2 = true)

After some testing I figured it comes down to:

if (var1 == true) {
  var2 = true;
}

Is this correct, or is there more to it? And why would anyone use this since the readability just dramatically reduces, since your assume at first glance it is just a check on two variables. So you really have to start looking at single or double equal sings and where the parentheses are, which just kinda, you know.. Just curious here..

Bastiaan
  • 686
  • 1
  • 8
  • 20

2 Answers2

2

Yes, this is equivalent. As far as I know, it is called short-circuit evaluation, describing the fact that the interpreter will return false for the whole boolean expression as soon as one of its parts is falsy.

Indeed, in your example it DOES reduce readability. But I think of it as just another tool in your toolbox you may use when you feel it could be useful. Consider the following:

return user && user.name;

This is one example when I tend to use it. In this case, I think it's actually more readable than

if (user) {
  return user.name;
} else {
  return undefined; // or null or something alike
}

UPDATE

I want to give you another example when I consider this kinds of constructs useful. Think of ES6 arrow functions like user => user.name. It does not need {} to open a body since it just has one line. If you wish to log something to the console (for debugging), you would end up having

user => {
  console.log(user); // or something alike
  return user.name;
}

You might as well use the shorter variant

user => console.log(user) || user.name

since console.log returns undefined after logging into the console, hence user.name is returned.

SVSchmidt
  • 6,269
  • 2
  • 26
  • 37
  • I have to disagree on the readability, you might save some lines but it does not get any clearer. I suspect you might get used to this though if you use it a lot – Bastiaan Jun 22 '17 at 16:38
  • @Bastiaan Yup. I think I would neither say "use it always" nor "never use it". It is just good to know every possibility you may have. – SVSchmidt Jun 22 '17 at 16:39
  • @SWSSchmidt, getting there not completely convinced yet :) You explanation though makes perfect sense, thanks! – Bastiaan Jun 22 '17 at 16:44
  • 1
    This neat trick `user => console.log(user) || user.name` is quite helpful for fat arrow functions. – Dez Jun 22 '17 at 16:52
0

Yes, as you've mentioned there's more to it.

the first part var1 == true checks whether ther result is true or false.

if the condition is false the code after it doesn't get checked or evaluated and thus var2 doesn't get set to true.

But if the first part of the condition var1 == true is true which obviously is true, the second part of the conditional statement the part after && is checked.

now the second part of the condition is an operation it sets (var2 = true) which is kind of a truthy operation.

we could edit your code a little bit to help you understand the operation more clearly: 

   if( var1 === true && (var2 = true)){console.log('good');}

I hope this helps

kapreski
  • 761
  • 5
  • 19
  • so the functionality is the same in the two samples I provided. – Bastiaan Jun 22 '17 at 17:05
  • well I won't put it this way, although the result is the same, in the first example you are checking both `var1 === true` AND the value of the operation `(var2 = true) ` itself whether it's truthy/falsy so the entire line `var1 === true && (var2 = 'watever')` is a boolean condion yes both example sets `var2` but in the first example you are also checking the result of the operation `var2 = true` yet not doing anything with the outcome whereas in the second example you are only checking var1 and setting var2 in case var1 was true.. – kapreski Jun 22 '17 at 18:04