具有两个真（？）条件运算符的Javascript三元运算符

Question

有人可以替代吗？请问以下代码中的那个？

return e = this.checked ? i - n > 0 ? 0 : i - n < 10 ? 10 : i - n : i - n < 0 ? 10 : i - n > 10 ? 0 : 10 + i - n

我特别困惑？接下来是另一个？在声明return e = this.checked ? i - n > 0 ? 0 .....的开头。那是什么意思？

谢谢

Answer 1

插入括号和缩进，您的代码相当于：

return e = this.checked
? (
  i - n > 0
  ? 0
  : (
    i - n < 10
    ? 10
    : i - n
  )
)
: (
  i - n < 0
  ? 10
  : (
    i - n > 10
    ? 0
    : 10 + i - n
  )
);

简而言之，在第一个表达式或第二个表达式中，你可以嵌套更多的三元运算符，因为它们也解析为表达式 - 但是，这并不意味着它是一个好主意，它是完全不可读的。

使用if-else和this tool：

if (this.checked) {
  if (i - n > 0) {
    return 0
  } else {
    if (i - n < 10) {
      return 10
    } else {
      return i - n
    }
  }
} else {
  if (i - n < 0) {
    return 10
  } else {
    if (i - n > 10) {
      return 0
    } else {
      return 10 + i - n
    }
  }
}

Answer 2

如果你把三元分解成它的各个部分可能会有用。基本上它有这个基本的结构：

condition ? a : b

在这里，如果a评估为condition，将执行true，如果评估为b，将触发false。

因此，将括号放在单独的三元运算符周围可以帮助清除事物。

return e = this.checked ? (i - n > 0 ? 0 : (i - n < 10 ? 10 : i - n)) : (i - n < 0 ? 10 : (i - n > 10 ? 0 : 10 + i - n))

所以在这里：

• condition是this.checked
• a是(i - n > 0 ? 0 : (i - n < 10 ? 10 : i - n))
• b是(i - n < 0 ? 10 : (i - n > 10 ? 0 : 10 + i - n))

或者，如果将其转换为if语句，您可能会发现它更容易理解：

if (this.checked) {
  if (i - n > 0) {
    return 0
  } else {
    if (i - n < 10) {
      return 10;
    } else {
      return i - n;
    }
  }
} else {
  if (i - n < 0) {
    return 10;
  } else {
    if (i - n > 10) {
      return 0;
    } else {
      return 10 + i - n;
    }
  }
}

Answer 3

为了使其更具可读性，您始终可以在代码中添加括号

return e = this.checked ? ( (i - n > 0 )? 0 : (i - n < 10 ? 10 : i - n ) ) 
                           : 
                          ( (i - n < 0) ? 10 : (i - n > 10 ? 0 : 10 + i - n) )

或者分成@Nick Parsons回答的单独部分。