Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Concatenate string with ternary operator in javascript [duplicate]

Its being annoying

Following code :

var arrays = [1,2,3];
alert('Array has ' + (arrays.length > 0) ? 'multiple':'single' + ' value');

alerts as the multiple where string is not concatenated with the ternary result.

But this code :

var arrays = [1,2,3];
alert('Array has ' + ((arrays.length > 0) ? 'multiple':'single') + ' value');

alerts as the Array has multiple value where string is concatenated with the ternary result.

My question is :

  1. Why the first code is not concatenated with string.
  2. Is there any syntax error in first code, if so why it doesnt throw an error.
like image 231
Raja Avatar asked Dec 06 '22 22:12

Raja


2 Answers

Your first example is parsed this way

alert(('Array has ' + (arrays.length > 0)) ? 'multiple':('single' + ' value'));

given the operator precedence of + is much higher than that of ?:.

like image 84
Alan Tam Avatar answered Dec 08 '22 11:12

Alan Tam


Both snippets are syntactically correct, but they differ because of operator precedence. The ternary operator has lower precedence than +.

In the first snippet:

var arrays = [1,2,3];
alert('Array has ' + (arrays.length > 0) ? 'multiple':'single' + ' value');

Javascript evaluates the first part 'Array has ' + (arrays.length > 0), which gives the string 'Array has true'. For conditional purposes, the nonempty string is the same as true (usually called a truthy value). Because the first operand in the ternary operator is truthy, the value of the whole expression will be the value of the expression 'multiple', that's between the ? and the :.

When you add the parameters in the second snippet, you make the ternary operator take only (arrays.length > 0) as its condition. That's why the code works as expected.

like image 35
Gustavo Bicalho Avatar answered Dec 08 '22 11:12

Gustavo Bicalho