Javascript 一个有点痛苦的三重嵌套三元运算符

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10526739/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 01:43:31  来源:igfitidea点击:

A somewhat painful triple-nested ternary operator

javascriptif-statementternary-operator

提问by Elliot Bonneville

I went looking through Raphael.js's source code to find out how he converted RGB values to HSB. I found out the function he did it in and I was in the process of converting it to Python when I bumped into this nice triple-nested ternary operator:

我查看了Raphael.js的源代码以了解他如何将 RGB 值转换为 HSB。我发现了他使用的函数,当我遇到这个漂亮的三元嵌套三元运算符时,我正在将它转换为 Python:

H = (C == 0 ? null :
    V == r ? (g - b) / C :
    V == g ? (b - r) / C + 2 :
             (r - g) / C + 4
    );

It threw me for a loop because Python doesn't have the same kind of ternary operator that Javascript does. I spent a while looking over it and eventually hashed this somewhat saner code (using only if/else) out of it:

它让我陷入了循环,因为 Python 没有 Javascript 那样的三元运算符。我花了一段时间查看它并最终将这个稍微理智的代码(仅使用 if/else)从其中散列出来:

if (C == 0) {
    H = null;
} else {
    if(V == r) {
        H = (g - b) / C;
    } else {
        if(V == g) {
            H = (b - r) / C + 2;
        } else {
            H = (r - g) / C + 4;
        }
    }
}

Was my interpretation correct? I'm only asking this because if it isn't correct, I'm faced with a lotof debugging. So. Did I "get it"?

我的解释正确吗?我只是问这个,因为如果它不正确,我将面临很多调试。所以。我“明白”了吗?

回答by Andrey Mikhaylov - lolmaus

To my personal taste, a carefully aligned nested ternary beats the if-esle mess:

根据我个人的口味,仔细对齐的嵌套三元比 if-esle 混乱:

const H =
  C == 0 ? null            :
  V == r ? (g - b) / C     :
  V == g ? (b - r) / C + 2 :
           (r - g) / C + 4 ;

回答by Joseph

I think you can have this to avoid the deep nesting:

我认为您可以使用它来避免深度嵌套:

var H

if(C == 0){
    H = null;
}
else if(V == r){
    H = (g - b) / C;
}
else if (V == g){
    H = (b - r) / C + 2;
}
else {
    H = (r - g) / C + 4;
}

回答by óscar López

The same logic can be written in a simpler way:

可以用更简单的方式编写相同的逻辑:

var H

if (C == 0)
    H = null;
else if (V == r)
    H = (g - b) / C;
else if (V == g)
    H = (b - r) / C + 2;
else
    H = (r - g) / C + 4;

It's possible to omit the curly braces because there's a single statement in each condition. And given that the conditions are mutually exclusive, using else ifis much clearer than nesting ifs.

可以省略花括号,因为每个条件中只有一个语句。并且考虑到条件是互斥的, usingelse if比嵌套ifs清晰得多。

回答by ssomnoremac

H = C == 0 
    ? null 
    : V == r 
        ? (g - b) / C 
        : V == g 
            ? (b - r) / C + 2 
            : (r - g) / C + 4

I've seen Dan Abramov using this indentation placement pattern. While I don't like how the conditional operator ?no longer visually follows the condition, I prefer this to something like @lolmaus's example in that the indentation will always be consistent regardless the size of the conditional.

我见过 Dan Abramov 使用这种缩进放置模式。虽然我不喜欢条件运算符如何在?视觉上不再遵循条件,但我更喜欢这种方式,而不是像 @lolmaus 的示例,因为无论条件的大小如何,缩进都将始终保持一致。

You actually start to look at it as ?true :false which is visually intuitive here. And this way, I find the ternary is much easier to spot and differentiate from the surrounding code.

实际上,你开始看它作为?真正的:错误是视觉上直观的在这里。通过这种方式,我发现三元更容易发现并与周围的代码区分开来。

回答by Lars Gyrup Brink Nielsen

If your JavaScript codebase contains nested ternary statements like the one in question, consider converting the formatting to daisy chained ternary statementsinstead.

如果您的 JavaScript 代码库包含与所讨论的类似的嵌套三元语句,请考虑将格式转换为菊花链三元语句

H = (C == 0)           // Is C zero?
    ? null
    : (V == r)         // Is V equal to r?
    ? (g - b) / C
    : (V == g)         // Is V equal to g?
    ? (b - r) / C + 2
    : (r - g) / C + 4; // Fallback (default) value

They simply read top to bottom in a straight line, returning a value as soon as they hit a truthy condition or the fallback.

Nested Ternaries are Great, Eric Elliot

他们只是在一条直线上从上到下读取,一旦遇到真实条件或回退,就立即返回一个值。

嵌套的三元组很棒,埃里克·埃利奥特

回答by Bergi

Yes, it's right (apart from capitalisation differences). Yet, it may be cleaner written without any parentheses, readable as elseif:

是的,这是正确的(除了大小写差异)。然而,没有任何括号的写法可能更清晰,可读性如 elseif:

if (C == 0)
    h = null;
else if (V == r)
    h = (g - b) / C;
else if (V == g)
    h = (b - r) / C + 2;
else
    h = (r - g) / C + 4;

回答by onedevteam.com

Here's another, more elegant idea...

这是另一个更优雅的想法......

if (C != 0) 
{
  if (V == r) return (g - b) / C;
  if (V == g) return (b - r) / C + 2;
  return (r - g) / C + 4;
}

return null;

Just wrap this in function and use instead of H...

只需将其包装在函数中并使用而不是 H ...