Javascript 写这个if/else的更有效的方法

我为一个输入字段写了一个小检查，它计算长度并确保它是正确的数量。它变得复杂，因为它需要允许9位数字或1个字母和5位数字。我现在使用的方法是可行的，但是代码伤了我的大脑，我想看看一个更优雅的解决方案会是什么样子，也许使用三元和/或开关

所以我现在有一小部分不太漂亮：

if (len !== 9) {
    if (len == 1) {
        y.hide();
        n.show();
        valInput.text("You need 8 more numbers");
    } else {
        if (len == 2) {
            y.hide();
            n.show();
            valInput.text("You need 7 more numbers");
        } else {
            if (len == 3) {
                y.hide();
                n.show();
                valInput.text("You need 6 more numbers");
            } else {
                if (len == 4) {
                    y.hide();
                    n.show();
                    valInput.text("You need 5 more numbers");
                } else {
                    if (len == 5) {
                        y.hide();
                        n.show();
                        valInput.text("You need 4 more numbers");
                    } else {
                        if (len == 6) {
                            y.hide();
                            n.show();
                            valInput.text("You need 3 more numbers");
                        } else {
                            if (len == 7) {
                                y.hide();
                                n.show();
                                valInput.text("You need 2 more numbers");
                            } else {
                                if (len == 8) {
                                    y.hide();
                                    n.show();
                                    valInput.text("You need 1 more number");
                                } else {
                                    if (len > 9) {
                                        y.hide();
                                        n.show();
                                        valInput.text("Order number must be 9 digits");
                                        // gt 9
                                    }
                                    // 8
                                }
                                // 7
                            }
                            // 6
                        }
                        // 5
                    }
                    // 4
                }
                // 3
            }
            // 2
        }
        // 1
    }
    // this is not equal to 9
}

更新

谢谢你的回答！很多好东西，我会在玩了一段时间后接受我最喜欢的。为了澄清当满足适当的要求时会发生什么，提交按钮会淡入，但直到它被验证。不确定它是否相关，但会提到该函数也以活动类型运行，因此每次之后都会返回带有计数的消息。keyup

在您的特定情况下，验证似乎足够简单，可以执行以下操作：

function validate(len) {
    var msg;
    if (len == 9)
        return true;
    y.hide(); /* no need to duplicate these calls in each condition */
    n.show();
    if (len < 9)
        msg = 'You need ' + (9-len) + ' more number' + (len == 1 ? '' : 's') + '.';
    else
        msg = 'You entered ' + (len-9) + ' number' + (len == 1 ? '' : 's') + ' too many.;
    valInput.text(msg);
    return false;

}

在您的特定情况下，验证似乎足够简单，可以实现以下功能：

function validate(len) {
    var msg;
    if (len == 9)
        return true;
    y.hide(); /* no need to duplicate these calls in each condition */
    n.show();
    if (len < 9)
        msg = 'You need ' + (9-len) + ' more number' + (len == 1 ? '' : 's') + '.';
    else
        msg = 'You entered ' + (len-9) + ' number' + (len == 1 ? '' : 's') + ' too many.;
    valInput.text(msg);
    return false;

}

---

如果不想使用switch，可以执行以下操作：

if (len < 9) {
    y.hide();
    n.show();
    valInput.text("You need " + (9 - len) + " more number(s)");
}
else if (len > 9) {
    y.hide();
    n.show();
    valInput.text("Order number must be 9 digits");
}
else {
    // all good here...
}

---

如果您不喜欢数字部分，只需检查len是否不是1，并将其添加到数字中。

如果您不想使用开关，可以执行以下操作：

if (len < 9) {
    y.hide();
    n.show();
    valInput.text("You need " + (9 - len) + " more number(s)");
}
else if (len > 9) {
    y.hide();
    n.show();
    valInput.text("Order number must be 9 digits");
}
else {
    // all good here...
}

---

如果您不喜欢数字部分，只需检查len是否不是1，并将其添加到数字中。

因为这些看起来都一样，为什么不使用这个：

if (len !== 9) {
    var diff = 9 - len;
    var value = ( 0 < diff ? "You need " + diff + " more numbers" : "Order number must be 9 digits" );
    y.hide();
    n.show();
    valInput.text(value);
}

---

这些看起来都一样，为什么不使用这个：

if (len !== 9) {
    var diff = 9 - len;
    var value = ( 0 < diff ? "You need " + diff + " more numbers" : "Order number must be 9 digits" );
    y.hide();
    n.show();
    valInput.text(value);
}

---

您可以将其简化为：

  if (len !== 9) {
      valInput.text("You need " +  (9 -len ) + " more numbers");
       y.hide();
      n.show();
   }

---

您可以将其简化为：

  if (len !== 9) {
      valInput.text("You need " +  (9 -len ) + " more numbers");
       y.hide();
      n.show();
   }

为什么还要使用开关或巨大的if

只需声明所需值的范围，然后连接字符串。

为什么还要使用开关或巨大的if

---

只需声明所需值的范围，然后连接字符串。

我认为您应该通过javascript计算剩余字符，因为这是所有其他if-else分支的唯一区别，因此您可以执行类似操作，并且可读性更高：

if (len !== 9) {
    y.hide();
    n.show();
    if (len > 9) {
        valInput.text("Order number must be 9 digits");
    }
    else{
        var remaining = 9 - len;
        valInput.text("You need " + remaining + " more numbers");
    }
}

---

我认为您应该通过javascript计算剩余的字符，因为这是所有其他if-else分支中唯一的区别，所以您可以这样做，并且可读性会更好：

if (len !== 9) {
    y.hide();
    n.show();
    if (len > 9) {
        valInput.text("Order number must be 9 digits");
    }
    else{
        var remaining = 9 - len;
        valInput.text("You need " + remaining + " more numbers");
    }
}

---

最短的备选方案：

(y.hide(), n.show(), valInput.text(
     len < 9 &&  "You need " + (9-len) + " more digits"
  || len > 9 && "too many ("+ (len-9) + ") digits" 
  || "ok!"
));

---

最短的备选方案：

(y.hide(), n.show(), valInput.text(
     len < 9 &&  "You need " + (9-len) + " more digits"
  || len > 9 && "too many ("+ (len-9) + ") digits" 
  || "ok!"
));

---

尝试使用开关。顺便说一句，您可以将它们合并为一个if..else…：if len<9{y.hide；n.show；valInput.text您需要+9-len+更多数字；}关于何时使用switch的教科书示例：d当然要使用switch，但即使没有它，为什么这是一个怪物？还有一个else if…这不是什么时候使用switch的教科书示例。这是一个教科书上的例子，说明什么时候用参数和变量编程，而不是检查幻数。谢谢你的评论@乔恩，这只是野兽的一小部分，相信我，它比这更可怕。。我将用switch重写，如果这是共识的话，我想这可能是一种避免这种情况的方法，因为所有的更改都是使用switch的整数。顺便说一句，您可以将它们合并为一个if..else…：if len<9{y.hide；n.show；valInput.text您需要+9-len+更多数字；}关于何时使用switch的教科书示例：d当然要使用switch，但即使没有它，为什么这是一个怪物？还有一个else if…这不是什么时候使用switch的教科书示例。这是一个教科书上的例子，说明什么时候用参数和变量编程，而不是检查幻数。谢谢你的评论@乔恩，这只是野兽的一小部分，相信我，它比这更可怕。。我会用switch重写，如果这是共识，我想可能是一种避免的方法，因为所有的变化都是整数+1，我会用if len&&len<9来确保它是一个非零数。@Sheikheera同意，但是0<9，我们假设len是从元素计数派生的一个正确的整数。@Shomz为什么有其他的呢？@Shomz谢谢哈哈，我编辑了我的代码来解决这个问题。我不知道他在找len实际上。。在西雅图，如果我能弄点干的，那就好了+1，我会使用if len&&len<9来确保它是一个非零的数字。@Sheikheera同意，但0<9，我们假设len是从元素计数派生的一个正确的整数。@Shomz为什么要使用else呢？@Shomz感谢hahaa我编辑了我的代码来解决这个问题。我不知道他在找len实际上。。在西雅图，如果我能弄点干的，那就好了；很好，除了我会多走一步，去掉剩下的变量-它真的不需要。很好，除了我会多走一步，去掉剩下的变量-它真的不需要。如果len！==9对于0是正确的，这就是为什么最好使用len&&len<9。@Sheikheera没有定义当值为0时应该发生什么。代码将给出：您还需要9个数字，这可能是需要的。如果len！==9对0是正确的，这就是为什么最好

---

如果len&&len<9，则使用。@Sheikheera未定义值为0时应发生的情况。代码将给出：您还需要9个数字，这可能是您想要的。