Javascript 嵌套三元运算符

Question

如果有人可以向我解释一下，我错过了一些东西。我正在尝试将现有代码重写为三元运算符方式。我收到以下控制台错误：

Uncaught SyntaxError: Unexpected token }

我知道有一个格式不正确的条件，我似乎找不到。所以我不确定我错过了什么，或者我是否误解了过滤器功能中的某些内容？不是吗？项目已验证 === 真 不假设自动返回对象是真的？

var engagement = "social";
var audience = [{ 'verified': true, 'name': 'Steve'},
                { 'verified': false, 'name': 'Phil'},
                { 'verified': true, 'name': 'Jason'}];
let data = [];
data = audience.filter((item) => {
    (engagement === "social") 
    ? item.verified === true
    : (engagement === 'social-crm') 
    ? item.verified === false 
    : (engagement === 'all')
    ? item
})

我理解的语法：

data = audience.filter((item) => {
              if (this.engagement === 'social-crm') {
                return item.verified === true;
              } else if (this.engagement === 'social') {
                return item.verified === false;
              } else if (this.engagement === 'all') {
                return item;
              }
});

这是我一直在尝试的小提琴：https://jsfiddle.net/phfilly/ya73e325/7/

Answer 1

是的。你的语法不正确。要了解为什么您的代码不起作用，如果您稍微重写一下 if-else 语句会有所帮助。

if (this.engagement === 'social-crm') {
    return item.verified === true;
} else if (this.engagement === 'social') {
    return item.verified === false;
} else if (this.engagement === 'all') {
    return item;
}

对此：

if(this.engagement === 'social-crm') { return item.verified === true; }
else {
   if(this.engagement === 'social') {item.verified === false; }
   else {
       if(this.engagement === 'all') {return item;} 
   }
}

现在，三元运算符遵循类似的嵌套方式。

cond1 ? val1 : ( val2 )

哪里val2 => cond2 ? val3 : (val4)

val4 => cond3 ? val5 : val6在哪里

所以，现在你可以像这样重写你的表达式：

this.engagement === 'social-crm' ? item.verified === true : 
    (this.engagement === 'social' ? item.verified === false : 
        (this.engagement === 'all' ?  item : null))

括号在这里很重要，因为它非常模仿上面嵌套的 if-else。

另请注意，对于最内部的表达式，必须在 else 中指定返回值。我已将其设置为 null，但您可以返回所需的内容。请注意，这是代码失败的实际原因。抱歉，如果答案很长，但我想帮助您理解嵌套的三元运算符。

Answer 2

三元运算符如下所示：

something = (condition) ? a_value : a_different_value;

你忘了最后一个案例的: a_different_value。

Answer 3

嵌套的三元运算符如下所示：

something = condition ? nested_condition ? value_if_both_conditions_are_true
    : value_if_nested_condition_is_false : value_if_condition_is_false;

即使没有括号，这也有效，但正如其他人所提到的，它可能很难阅读。特别是当通过在本示例的条件部分中使用&&或||来检查多个条件时。

Answer 4

试试这个

您必须为三元运算符设置条件

，如@Quentin

data = audience.filter((item) => { (engagement === "social") ? 
item.verified === true : (engagement === 'social-crm') ? 
item.verified === false : (engagement === 'all')? 
item : null})

Answer 5

深度嵌套可以像这样更简单的方式编写三元 if-else

let userName = 'Amoos'
let isStudent = false
let age = 7

userName 
      ? console.log(`User name: ${userName} 😊`) 
      : console.log('Unknow user');
      isStudent ? console.log("Yes, is student 👨‍🎓") 
                : console.log('No, not a student 👨‍🎓');
                (age<18) ? console.log("Younger 👶")
                         : console.log("Elder 😁")