Question

我有几个不同的单选按钮，可以返回种族和性别。该脚本在内部应用程序内部运行，因此不是返回“boy”，“girl”或“both”，而是返回7707330,7707333和7707336.类似于种族单选按钮。

然后，我需要根据种族和性别的组合验证数据。这是一个非常简单的任务，但我最终得到了15个if语句！一切都按预期工作，但必须有一个更清洁的解决方案？

function test(radioResults) {
    var1 = radioResults[0].toString();
    var2 = radioResults[1].toString();

    var roll = parseFloat(parent.roll);

    if (var2 == '7707330') {
        gender = 'boy';
    }
    if (var2 == '7707333') {
        gender = 'girl';
    }
    if (var2 == '7707336') {
        gender = 'both';
    }

    if (var1 == '7707341') {
        maori(gender);
    }
    if (var1 == '7707344') {
        pasifika(gender);
    }
    if (var1 == '7707347') {
        all(gender);
    }
}

function maori(gender) {
    //Maori 
    if (gender == 'boy') {
        ethnicity = parseFloat(parent.getMBoys);
        validation(ethnicity);
    }
    if (gender == 'girl') {
        ethnicity = parseFloat(parent.getMGirls);
        validation(ethnicity);
    }
    if (gender == 'both') {
        ethnicity = parseFloat(parent.getTotalM);
        validation(ethnicity);
    }
}

function pasifika(gender) {
    //Pasifika
    if (gender == 'boy') {
        ethnicity = parseFloat(parent.getPBoys);
        validation(ethnicity);
    }
    if (gender == 'girl') {
        ethnicity = parseFloat(parent.getPGirls);
        validation(ethnicity);
    }
    if (gender == 'both') {
        ethnicity = parseFloat(parent.getTotalP);
        validation(ethnicity);
    }
}

function all(gender) {
    //All
    if (gender == 'boy') {
        ethnicity = parseFloat(parent.getBoys);
        validation(ethnicity);
    }
    if (gender == 'girl') {
        ethnicity = parseFloat(parent.getGirls);
        validation(ethnicity);
    }
    if (gender == 'both') {
        ethnicity = parseFloat(parent.getTotalRoll);
        validation(ethnicity);
    }
}

function validation(ethnicity) {

    percent = ethnicity * 5 / 100;

    if (ethnicity - percent > roll || (ethnicity + percent < roll)) {
        parent.document.getElementById('CF_7784443').value = "FAIL";
    } else {
        parent.document.getElementById('CF_7784443').value = "PASS";
    }
}

我该如何清理它？

Answer 1

我不确定这是否符合您的口味，但对我来说这似乎是一个更清洁的解决方案。首先分别布置所有映射。然后将映射解析为 parent 的正确属性。然后只为您检索到的属性调用 validation 一次。这是一个草图：

// map var1 and var2 to gender and ethnicity
var genderMap = { "7707330" : "boy", "7707333": "girl", "7707336": "both" };
var ethnicityMap = { "7707341": "maori", "7707344": "pasifica", "7707347": "all" };

// map gender and ethnicity to the correct property of "parent"
var props = 
    { "boy": 
        {
            "maori": "getMBoys", "pacifica": "getPBoys", "all": "getBoys"
        },
        "girl": 
        {   
            "maori": "getMGirls", "pacifica": "getPGirls", "all": "getGirls"
        },
        "all":
        {   
            "maori": "getTotalM", "pacifica": "getTotalP", "all": "getTotalRoll"
        }
    };

// get the correct property    
var prop = props[genderMap[var1]][ethnicityMap[var2]];

// run the validation
validation(parseFloat(parent[prop]));

Answer 2

使用switch可能有帮助

switch (var2) {  
   case '7707330': gender = 'boy'; break;  
   case '7707333': gender = 'girl'; break;  
   case '7707336': gender = 'both'; break;
   default: gender = 'not boy or girl here?';
}

文件here in MDN

编辑：缩小换行符。

Answer 3

我会这样编码。有些人可能会建议switch语句，但我真的从未在我的代码中使用它们，因为它们会增加行数而不会影响可读性：

function foo() {
  var func;

  if (var1 == '7707330') {
    func = maori;
  } else if (var1 == '7707344') {
    func = pasifika;
  } else if (var1 == '7707347') {
    func = all;
  }

  if (var2 == '7707330') {
    func('boy');
  } else if (var2 == '7707333') {
    func('girl');
  } else if (var2 == '7707336'):
    func('both');
  }
}

function maori(gender) {
  //Maori 
  if (gender == 'boy') {
    ethnicity = parseFloat(parent.getMBoys);
  } else if (gender == 'girl') {
    ethnicity = parseFloat(parent.getMGirls);
  } else if (gender == 'both') {
    ethnicity = parseFloat(parent.getTotalM);
  }

  validation(ethnicity);
}

function pasifika(gender) {
  //Pasifika
  if (gender == 'boy') {
    ethnicity = parseFloat(parent.getPBoys);
  } else if (gender == 'girl') {
    ethnicity = parseFloat(parent.getPGirls);
  } else if (gender == 'both') {
    ethnicity = parseFloat(parent.getTotalP);
  }

  validation(ethnicity);
}

function all(gender) {
  //All
  if (gender == 'boy') {
    ethnicity = parseFloat(parent.getBoys);
  } else if (gender == 'girl') {
    ethnicity = parseFloat(parent.getGirls);
  } else if (gender == 'both') {
    ethnicity = parseFloat(parent.getTotalRoll);
  }

  validation(ethnicity);
}

function validation(ethnicity) {
  var percent = ethnicity * 5 / 100;

  if (ethnicity - percent > roll || (ethnicity + percent < roll)) {
    parent.document.getElementById('CF_7784443').value = "FAIL";
  } else {
    parent.document.getElementById('CF_7784443').value = "PASS";
  }
}

Answer 4

好吧，就干净的代码而言，您可以为Switch语句交换if，这是一个描述：

http://www.w3schools.com/js/js_switch.asp

好吧，这是你能得到的最佳替代品。当然你的代码也是有效的。

Javascript - 替换大量的if语句

4 个答案: