在javascript中使用三元运算符连接字符串

Question

令人讨厌

以下代码：

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

警告multiple字符串未连接与三元结果。

但是这段代码：

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

警告Array has multiple value其中字符串与三元结果连接。

我的问题是：

1. 为什么第一个代码没有与字符串连接。
2. 第一个代码中是否存在语法错误，如果是这样，为什么它不会引发错误。

Answer 1

您的第一个示例以这种方式解析

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

鉴于+ operator precedence远远高于?:。

Answer 2

两个片段在语法上都是正确的，但由于运算符优先级而不同。三元运算符的优先级低于+。

在第一个片段中：

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

Javascript评估第一部分'Array has ' + (arrays.length > 0)，它给出字符串'Array has true'。出于条件目的，非空字符串与true相同（通常称为 truthy 值）。因为三元运算符中的第一个操作数是真实的，所以整个表达式的值将是表达式'multiple'的值，它位于?和:之间。

在第二个代码段中添加参数时，您将使三元运算符仅以(arrays.length > 0)为条件。这就是代码按预期工作的原因。