设计 Javascript 验证方法答案

【问题标题】：Designing Javascript validation methods设计 Javascript 验证方法
【发布时间】：2009-04-27 18:04:09
【问题描述】：

在 JavaScript 中进行验证时，如何让需要处理大量意外事件的验证方法变得不守规矩？

例如，我有一个表单，其中包含一个具有检查验证的字段：

新值是数字吗？
上的另一个字段中的值是当当前字段 > 0 时 form > 0
是表单上的另一个字段 == 1 并且当前字段 == 0
是表单上的另一个字段 == true 并且当前字段是 Mod 另一个字段 == 0

等等

目前，我有一个包含一堆 if/else 语句的方法。

我可以将每次检出分解成它自己的方法并从主验证方法中调用它，但这会创建大量新方法。

更新：无论我使用框架还是单独的方法，我是否仍然接受使用 If/Else 或 Switch 语句填充调用验证方法，并带有失败验证的警告框？

【问题讨论】：

标签： javascript validation

【解决方案1】：

为什么要重新发明轮子？我建议jQuery Validation Plugin。也请查看demo pages

【讨论】：

【解决方案2】：

听起来您可能想要一个基本的状态机。您可能会考虑的一件事是将验证器分解为最简单的形式：

function validator(op, options, pass, fail) {
    if (op(options)) {
        pass(options);
    } else {
        fail(options);
    }
}

然后您可以将它们链接在一起以形成更复杂的系统。

function isFooChecked(options) {
    return $(options.foo).is(':checked');
}

function sayHi(options) {
    alert('hi ' + options.name);
}

function fail(options) {
    alert(options.name + ' was bad');
}

function validateName() {
    validator(isFooChecked, { foo: '#someField', name: $('#nameField').val() }, sayHi, fail);
}

你仍然会有很多代码，但如果你做得对，函数应该小而易于理解。

【讨论】：

【解决方案3】：

我建议将每个单独的签出拆分为自己的方法，并将要验证的控件作为参数传入。这样你就可以很容易地重用常用的（“新值是数字吗？”）。

我不知道在 JavaScript 中使用大量方法（除了命名空间拥挤）有什么缺点，但我可能会遗漏一些东西。

当然，您可能还想考虑使用framework of some kind。

【讨论】：

【解决方案4】：

我有一个 Json 对象，看起来像

{'field1': {'rule_name1':{'rule': rule1, 'message': message1},
    {'rule_name2':{'rule': rule2, 'message': message2}},
    field2: {'rule_name3':{'rule': rule3, 'message': message3},
    {'rule_name4':{'rule': rule1, 'message': message1}},
    {'rule_name5':{'rule': rule4, 'message': message4}}}

或者，如果你觉得它更具可读性

field1
    rule_name1
        rule: rule1
        message: message1
    rule_name2
        rule: rule2
        message: message2
field2
    rule_name3
        rule: rule3
        message: message3
    rule_name4
        rule: rule1
        message: message1
    rule_name5
        rule: rule4
        message: message4

基本上，您有一个字段列表。在每个字段下，您可以找到一个规则列表，其名称不相关，并且对于每个 rule_name，您都有一个规则和一条消息。

每次我需要检查一个字段时，我都会找到对应的子对象。然后我遍历 rule_names，对于 rule_name，我得到一条规则和一条消息。该规则对应于检查字段的方法（例如“notEmpty()”）。所以我调用了这个方法：如果它返回 true，我将迭代带到下一个 rule_name。否则我会返回消息。

然后我可以在视图方法中随意使用消息。

【讨论】：