策略模式

策略模式:定义一系列算法,把他们一个个封装起来,一般分装在一个策略对象中,将算法的使用和算法的实现分离开来

优点:代码简洁,保持弹性,代码复用。

缺点:增加许多策略类和策略对象。

应用:

1.比如计算奖金,不同的奖金基数和等级对于不同的工资

var Caculate=function(level,salary){
      return strategis[level](salary);
}
//把各种算法封装在策略对象中;
var strategis={
     'S':function(salary){
         return 4*salary;
     },
     'A':function(salary){
         return 3*salary;
     },
     'B':function(){
         return 2*salary;
     }
}

alert(Caculate('A',20000))

2.表单验证

var strategis = {
    isEmpty: function(value, errorMsg) {
        if (value == '') {
            return errorMsg;
        }
    },
    minLength: function(value, length, errorMsg) {
        if (value.length < length) {
            return errorMsg;
        }
    },
    isMobile: function(value, errorMsg) {
        if ((!1[3 | 5 | 8][0 - 9] { 9 }
                $).test(value)) {
            return errorMsg;
        }
    }
}

var Validator = function() {
    this.cache = [];//保存校验规则

}

Validator.prototype.add = function(dom, rule, errorMsg) {
    var arr = rule.split(':');
    this.cache.push(function() {
        var strategy = arr.shift();
        arr.unshift(dom.value);
        arr.push(errorMsg);
        return strategis[strategy].apply(dom, arr);
    })
};
Validator.prototype.start = function() {
    for (var i = 0, validateFunc; validateFunc = this.cache[i++];) {
        var msg = validateFunc();
        if (msg) {
            return msg;
        }
    }
}
var ValidateFunc = function() {
    var validator = new Validator;
    //添加一些校验规则
    validator.add(registerForm.userName, 'isEmpty', '用户名不能为空');
    validator.add(registerForm.password, 'isEmpty', '密码不能少于四位');
    validator.add(registerForm.phoneNumber, 'isEmpty', '手机号码格式不正确');
    var errorMsg = validator.start();//获得校验结果
    return errorMsg;
}
registerForm.onsubmit = function() {
    var errorMsg = ValidateFunc();
    if (errorMsg) {
        alert(errorMsg);
        return false;//阻止表单提交
    }
};

使用策略模式后,我们可以通过配置的方式完成一个表单的验证,这些验证可以复用在程序的任何地方,还能作为插件的形式。方便的移植到其他项目当中。

在修改的时候只需要编写少量的代码。

posted @ 2017-04-27 16:13  T1amo  阅读(155)  评论(0)    收藏  举报