JavaScript 三元运算中的条件后的多个操作答案

【问题标题】：Multiple actions after a condition in a JavaScript ternary operationJavaScript 三元运算中的条件后的多个操作
【发布时间】：2021-01-21 10:00:08
【问题描述】：

我正在尝试创建一个三元表达式，而不是何时为真，我将为一个对象分配几个新键。这会返回一个错误：

const entity = {};

    element.data.icon ? 
    entity['url'] = element.data.icon.data.image[0].url 
    entity['alt'] = element.data.icon.data.image[0].alt
    entity['title'] = element.data.icon.data.image[0].title :
    entity['url'] = ''

我正在尝试获得与此等价的内容：

const entity = {};
if (element.data.icon) {
        entity['url'] = element.data.icon.data.image[0].url 
        entity['alt'] = element.data.icon.data.image[0].alt
        entity['title'] = element.data.icon.data.image[0].title 
    }
    entity['url'] = ''

我该怎么做？如果可能的话

【问题讨论】：

由于检查后有四个作业，我建议坚持使用更易读的if-else 结构。三元运算符只会使这变得难以调试和诚实。不会为您的代码增加任何性能提升。
您是否忘记了最后一个代码块中的else？

标签： javascript conditional-operator

【解决方案1】：

为什么不直接使用if 版本？它会更具可读性。

话虽如此，您可以像这样使用逗号：

element.data.icon
  ? (entity['url'] = element.data.icon.data.image[0].url,
     entity['alt'] = element.data.icon.data.image[0].alt,
     entity['title'] = element.data.icon.data.image[0].title)
  : entity['url'] = '';

【讨论】：

【解决方案2】：

您可以使用三元来分配不同的完整对象：

const entity = element.data.icon 
    ? {
        url: element.data.icon.data.image[0].url, 
        alt: element.data.icon.data.image[0].alt,
        title: element.data.icon.data.image[0].title
    } 
    : { 
        url: ""
    };

【讨论】：