JavaScript 中没有“else”的三元运算符

IT技术 javascript optimization syntax-error
2021-02-11 12:19:22

我总是不得不放入null没有任何东西的 else 条件。有办法解决吗?

例如,

condition ? x = true : null;

基本上,有没有办法做到以下几点?

condition ? x = true;

现在它显示为语法错误。

仅供参考,这是一些真实的示例代码:

!defaults.slideshowWidth ? defaults.slideshowWidth = obj.find('img').width()+'px' : null;
6个回答

首先,三元表达式不是 if/else 结构的替代品——它等同于返回的 if/else 结构也就是说,if/else 子句是代码,三元表达式是表达式,意味着它返回一个值。

这意味着几件事:

  • 仅当左侧=有要分配返回值的变量时才使用三元表达式
  • 仅当返回值是两个值之一时才使用三元表达式(如果合适,则使用嵌套表达式)
  • 表达式的每一部分(在 ? 和 : 之后)都应该返回一个没有副作用的值(表达式x = true返回 true 因为所有表达式都返回最后一个值,但它也会改变 x 而 x 对返回值没有任何影响)

简而言之 - 三元表达式的“正确”使用是

var resultofexpression = conditionasboolean ? truepart: falsepart;

代替您的 example condition ? x=true : null ;,您可以使用三元表达式来设置 的值x,您可以使用:

 condition && (x = true);

这仍然是一个表达式,因此可能无法通过验证,因此更好的方法是

 void(condition && x = true);

最后一个将通过验证。

但话又说回来,如果预期值是一个布尔值,只需使用条件表达式本身的结果

var x = (condition); // var x = (foo == "bar");

更新

关于您的样本,这可能更合适:

defaults.slideshowWidth = defaults.slideshowWidth || obj.find('img').width()+'px';
void(condition && x = true) - 这看起来不错,但似乎抛出“无效的左侧赋值”错误
2021-03-17 12:19:22
然而,这读起来并不直观,特别是对于不习惯这种风格的开发人员。您可以像这样轻松且更具可读性地编写此代码: if (condition) { x=true; }
2021-03-18 12:19:22
您能否详细说明为什么只有在将结果值分配给您的变量时才应使用条件三元运算符?我指的是你的清单中的第一点。意图是可以理解的,但是我想知道在返回值未使用时是否有特定原因不使用三元运算符,例如性能,安全性或其他什么。
2021-03-18 12:19:22
你能解释一下“可能无法通过验证”是什么意思吗?我不明白为什么应该将表达式包装在void(). 谢谢。
2021-04-02 12:19:22
出色的 SO,不允许编辑更正i/else错字,因为它没有足够的字符。
2021-04-10 12:19:22

不,它需要三个操作数。这就是为什么它们被称为三元运算符。

但是,对于您所拥有的示例,您可以这样做:

if(condition) x = true;

如果以后需要添加多个语句,使用大括号会更安全:

if(condition) { x = true; }

编辑:既然您提到了您的问题适用的实际代码:

if(!defaults.slideshowWidth)
    { defaults.slideshowWidth = obj.find('img').width()+'px'; }
你可以,但你不应该。至少周围没有大括号 - 它非常容易出错。
2021-03-15 12:19:22
@Cheeso 在重构的意义上很容易出错。你回来添加更多在真实条件的情况下做,而没有意识到那里没有花括号。新代码将始终执行,而不是在 true 的情况下。
2021-03-28 12:19:22
真的吗?我明白需要 curl 的主要原因是因为它们让 jslint 的生活更轻松。
2021-04-07 12:19:22
老实说,我从来没有见过比 Javascript 更害怕使用一种语言的开发人员:-PI 不喜欢有人告诉我我不应该使用花括号。我省略了很多,而且从来没有比我不小心丢失支具更多的麻烦。
2021-04-07 12:19:22
不,我知道,我只是喜欢编写没有附加条件的条件,例如 if(){}else{} 当它等于简单的 ?:;
2021-04-12 12:19:22

更常见的是,人们使用逻辑运算符来缩短语句语法:

!defaults.slideshowWidth &&
  (defaults.slideshowWidth = obj.find('img').width() + 'px');

但在您的特定情况下,语法可以更简单:

defaults.slideshowWidth = defaults.slideshowWidth || obj.find('img').width() + 'px';

defaults.slideshowWidth如果defaults.slideshowWidth被评估为真,此代码将返回obj.find('img').width() + 'px'值,否则返回值。

有关详细信息,请参阅逻辑运算符的短路评估

var x = condition || null;
> 如果可以转换为true,则返回expr1;否则,返回 expr2。逻辑运算符 (MDN)
2021-03-21 12:19:22
(defaults.slideshowWidth) || (defaults.slideshowWidth = obj.find('img').width()+'px') 或者 defaults.slideshowWidth = defaults.slideshowWidth || (obj.find('img').width()+'px')
2021-04-04 12:19:22

你可以写

x = condition ? true : x;

所以当条件为假时 x 未被修改。

这则相当于

if (condition) x = true

编辑:

!defaults.slideshowWidth 
      ? defaults.slideshowWidth = obj.find('img').width()+'px' 
      : null 

有几个替代方案——我不是说这些更好/更糟——只是替代方案

将 null 作为第三个参数传递有效,因为现有值为 null。如果您重构并更改条件,则存在不再正确的危险。传入现有值作为三元中的 2nd 选择防止这种情况:

!defaults.slideshowWidth = 
      ? defaults.slideshowWidth = obj.find('img').width()+'px' 
      : defaults.slideshowwidth 

更安全,但可能不那么好看,而且打字更多。在实践中,我可能会写

defaults.slideshowWidth = defaults.slideshowWidth 
               || obj.find('img').width()+'px'
一些实时代码是(无论如何要摆脱这里的空值?): !defaults.slideshowWidth ?defaults.slideshowWidth = obj.find('img').width()+'px' : null ;
2021-03-20 12:19:22