改进多个 if 语句的语法？答案

【问题标题】：Improve Syntax on Multiple If Statements?改进多个 if 语句的语法？
【发布时间】：2012-08-02 02:00:15
【问题描述】：

有没有办法让这个更漂亮；

if ($("#Input").text === "A") { sOutput = "a"; lColor = "red"; }
if ($("#Input").text === "B") { sOutput = "b"; lColor = "orange"; }
if ($("#Input").text === "C") { sOutput = "c"; lColor = "yellow"; }
if ($("#Input").text === "D") { sOutput = "d"; lColor = "green"; }
if ($("#Input").text === "E") { sOutput = "e"; lColor = "blue"; }
if ($("#Input").text === "F") { sOutput = "f"; lColor = "violet"; }
...

真正的代码要广泛得多，带有 && 和 ||不同变量之间。但是每一行都遵循相同的语法，保存我正在寻找的“字母”和我设置的变量。我有这么多如果，我觉得很浪费。

*代码是用来说明我的观点的虚拟代码。

编辑

虚拟代码并不能说明我的观点，所以这里是真实的示例；

    if ($(".Fig_Main").hasClass("Active")) {
        sect_1 =  (($(".Fig_A").hasClass("Active")) && ($(".Fig_1").hasClass("Active"))) ? "Slide_A1"
              : (($(".Fig_A").hasClass("Active")) && ($(".Fig_B").hasClass("Active"))) ? "Slide_AB"
              : (($(".Fig_1").hasClass("Active")) && ($(".Fig_B").hasClass("Active"))) ? "Slide_1B"
              : (($(".Fig_1").hasClass("Active")) && ($(".Fig_3").hasClass("Active"))) ? "Slide_13"
              ...

我将这个块（长几行）重复了几次，每次都针对不同的 sect_#，以及结果设置值 (Slide_XY)。

非常感谢所有当前的建议。坚持下去。

【问题讨论】：

使用地图和小写字母。不知道非虚拟代码是否有益，但是 - 不知道您真正在做什么，很难知道如何提供帮助。
代码可读，但不一定高效。如果没有else，javascript 将别无选择，只能测试所有条件。
@RosdiKasim，不是Java，而是'javascript'。
@SheikhHeera，我更正了。由于它是 javascript，您可以使用 switch 而不是 if else
@RosdiKasim，我不是OP，那么xdazz 的答案呢？

标签： jquery loops syntax if-statement

【解决方案1】：

你可以这样做：

var dic = {
  "a": "red",
  "b": "orange",
  "c": "yellow",
  "d": "green",
  "e": "blue",
  "f": "violet"
};

sOutput = $("#Input").text().toLowerCase();
lColor = dic[sOutput];

【讨论】：

虽然这很好，但我对转换为小写没有兴趣，这只是示例的一部分。如果这种格式可以支持每个“if”声明多个变量，那么我会喜欢的。

【解决方案2】：

你可以使用对象字面量。

//extend the object as needed.
var obj = {
    'A': { sOutput:'a', lColor: 'red' },
    'B': { sOutput:'b', lColor: 'orange' },
}

var x = 'B';

console.log( obj[x] );

编辑：

您甚至可以进一步测试以查看是否定义了“x”变量的值：

var x = 'Z';

if( !(x in obj) ){
     //do stuff if Z isn't defined
}

【讨论】：

【解决方案3】：

switch 语句可读。你可以尝试任何其他花哨的方式，但对我来说，可读性是优先级数 1。

switch ($("#Input").text){
    case "A": 
        sOutput = "a"; 
        lColor = "red";
        break;
    case "B":
        sOutput = "b"; 
        lColor = "orange"; 
        break;
    case "C": 
       sOutput = "c"; 
       lColor = "yellow";
       break;
}

【讨论】：

如果是 ($("#Input " + target + "_Container").text) 我也想翻阅 'target' 怎么办？
听起来你有类似的发音 css id，在这种情况下你应该使用正确的 jQuery 'ends with' 或 'starts with' 选择器，参考这里：api.jquery.com/category/selectors

【解决方案4】：

我决定重新设计我的整个逻辑，并开发出更好的东西。

感谢大家的帮助！

【讨论】：