这个函数封装的有意义吗?~

这是原始状态

clipboard.png

封装后判断是这样的

clipboard.png

阅读 2.5k
4 个回答

还是有意义、比如你的formName变量名改了、你只需要改动一处就可以了、不然要每行都改、

再比如、你传进来的name要根据规则做个字符串拼接、也只需要改一处、

函数的封装是为了维护方便、前期多花功夫是为了后面不让自己难受、希望可以帮到你

下次多个字段岂不是又要加一句 else if?

试着把检验的字段和返回的信息抽离出来, 是否更好一点?
如下(未测试代码正确性):

var fields = {
    name: {
        required: '请输入公司名称'
    },
    principalEmail: {
        email: '请输入正确的负责人邮箱'
    }
};
function check(formName) {
    var i, ii, field;
    for(i in fields) {
        if(fields.hasOwnProperty(i)) {
            field = fields[i];
            for(ii in field) {
                if(field.hasOwnProperty(ii)) {
                    if(formName[i] && formName[i].$error.[ii]) {
                        return formName[i].$error.[ii];
                    }
                }
            }
        }
    }
    return null;
}

var tips = check(formName);
if(tips) {
    promptLayer({str: tips});
} else {
    addMember.addMember();
}

没意义。 有了封装的意识, 但是没做好。
我会这样写:

// 代码没有仔细写,有点乱,不过应该不影响理解。
// 数据
const check = {
    name: [{
        msg: '请输入公司名称',
        checkItem: 'required'
    }],
    principalEmail: [{
        msg: '请输入负责人的邮箱',
        checkItem: 'required'
    }, {
        msg: '请输入正确的负责人的邮箱',
        checkItem: 'email'
    }]
};

// 逻辑
for(var k in check) {
    for(var i = 0, len = check[k].length; i < len; i++) {
        if(formName[k].$error[check[k][i].checkItem]) {
            promptLayer({str: check[k][i].msg});
        }
    }
}

为什么这样写呢?
程序由逻辑和数据组成,所以,要把数据和逻辑分开来。
按照我的代码, 如果验证项需要修改,只要改数据就好了。逻辑只要测过一遍,就可以保证正确(还可以使用单元测试来保证正确)。
还有就是,逻辑可以被不同业务所复用,只要传入对应业务的数据就好。

封装有意义, 如果check的条件改动只需要改check函数一处。

不过还可以进一步改。


const actions = [
  ['name', '公司名称'],
  ['principal', '负责人']
  // ... 其他数据
]

let match = false
for (let i = 0; i < actions.length; i++) {
  match = check(actions[i][0])
  if (match) {
    promptLayer(actions[i][1])
    break
  }
}

if (!match) {
    addMember.addMember()
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题