1
var test = 2;

test === 2 && console.log('true');

This confuses me. I hadn't seen this before until the other day. The output of this will be true in the console.

So how does this magic work?

Alex McCabe
  • 1,852
  • 2
  • 20
  • 33

4 Answers4

4

This (mis)uses the boolean handling of JavaScript; because of the lazy evaluation of expressions, console.log('true') is only run, when someVar === 2 was previously evaluated as true.

This behaviour is called Short-circuit evaluation.

Other use-cases

By the way, this type of coding has legit use cases. My favourite is the use of configuration objects:

function (options) {
    var options = options || {};
}

This way, the options object exists even if it was not given in as a parameter.

meskobalazs
  • 15,741
  • 2
  • 40
  • 63
  • This would be true if there were a variable name after `var`, as it is, you get a syntax error – Ruan Mendes Jan 26 '15 at 14:40
  • 1
    The `var` was just a placeholder used by OP, he fixed his error. – meskobalazs Jan 26 '15 at 14:41
  • There were a number of edits to the post. At one point it was indeed edited to say "someVar === 2" but then your edit took that out. – chsh Jan 26 '15 at 14:41
  • Thank you for this, and actually understanding what I meant initially. Haha. Now that you mention it, I have used that function example before, but a while ago. – Alex McCabe Jan 26 '15 at 14:50
2

Actually, this code isn't valid:

var === 2 && console.log('true')
   VM132:2 Uncaught SyntaxError: Unexpected token ===

You can try it yourself in the browser (i.e. in Chrome look for Developer Tools).

See http://jsfiddle.net/jcdxnte0/

EDIT:

The syntax x && y means that both x and y need to be true. This means, that if x is true, y will get evaluated, and if x is false, y will not get evaluated (because x was false, so both will never be true so why bother evaluating y? - evaluation goes from left to right). In your case, x is test === 2, and y is console.log(...).

kamituel
  • 34,606
  • 6
  • 81
  • 98
2

it can be read as

if( test === 2 ){ console.log('true'); }

It works because (test === 2) is an expression which resolves to a value.
It'll resolve to either true or false. JavaScript will then execute code after && only if the preceding expression returned true. (so false && console.log() won't log anything).

Another fun way to abuse it and confuse other developers is the fact that assignment also returns a value, for example

var x = 0, y = 5;
(x = y) && console.log( 'x is now 5' );

in this case (x = y) not only assigns the value of y to x, but also returns 5 which is truthy, so the console.log gets evaluated. don't use this, please.

pawel
  • 35,827
  • 7
  • 56
  • 53
  • Thank you for your answer, and that second part. That's amusing. I wouldn't ever use it, I just saw it in an article. I tend to not use things that can confuse as I am not the only person that works with the JS on the project. It is however odd that I haven't ever seen this since I started JS development... – Alex McCabe Jan 26 '15 at 14:52
0

JavaScript evaluates the left part and, if it's true, executes the right part. You can do the opposite with the || operator.

It's also worth noting that the right part should be wrapped in parenthesis if it contains an assignment:

var foo;   
true && (foo = "bar");

While it's perfectly valid, I'd recommend not using this syntax.

Benjamin De Cock
  • 210
  • 1
  • 5