策略模式概述

策略模式

  • 优点以及定义
    策略模式是一种从算法的角度上考虑问题的方式,所有需要算法解决的问题,都可以采用策略模式的角度,降低算法与算法之间的偶尔度

    偶尔度说白了就是一个方法对于一个方法的依赖性,就是删除一个方法尽可能少的影响其他的方法

  • 使用
    其实我们在开发的过程中,都使用过策略模式,只是我们本身没有去注意摆了

举例说明使用

  • 现在我们要做一个表单验证
    正常新情况下
$('#btn_send').click(function(){
    var username=$('#username').val();
    var qq=$('#qq').val();
    var pass=$('#new_password').val();
    var newpass=$('#password').val();
    var emil=$('#emil').val();
    var tel=$('#tel').val();
    if(username<4){
        layer.msg('用户名不正确',{time:1500});
        return false;
    }
    if(newpass<4){
        layer.msg('密码格式不正确',{time:1500});
        return false;
    }
    if(newpass!=pass){
        layer.msg('两次密码不一致',{time:1500});
        return false;
    }
    if(qq<6){
        layer.msg('QQ号不正确',{time:1500});
        return false;
    }
    if(!(/^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/g.test($('#emil').val()))){
        layer.msg('邮箱格式不正确',{time:1500});
        return false;
    }
    $.post('ajaxRegister.php',{
        username:username,
        qq:qq,
        pass:pass,
        emil:emil,
        tel:tel
    },function(data){
        console.log(data);
        if(data==1){
            layer.msg('注册成功',{time:2000});
            window.location.href="main.php";
        }else{
            layer.msg('注册失败,稍后再试',{time:2000});
            return false;
        }
    })
})

我们就光看这个表单验证的if就可以了,在这里我们使用了5,6个if进行的判断,那么后期如果扩展起来很麻烦,搞不清楚应该放在那个if的后面,如果想要修改器中的一个,改起来也不是很方便,那么我就在想了,如果我可以把他单独的抽离出来,不是很完美么
策略模式

const obj = {
    "username": function(message){
        return message<4?{msg:'用户名不正确',code:001}:true
    }
    "newpass": function(message){
        return message<4?{msg:'密码格式不正确',code:001}:true
    }
    "yanPass": function(pass,newPass){
        return pass===newPass?{msg:'两次密码不一致',code:001}:true
    }
    ...
}

这个时候我们的源文件就可以修改为直接获取obj里面对应的方法了,然后通过返回值判断是否通过

  • 这个时候如果我们想要增加一条判断,只需要增加一个方法,不需要过多操作,那么这种把单独抽离的方式,我们称之策略模式

扩展

  • 说了这么多,策略模式究竟有哪些项目在使用呢(如果他不被使用,那么我们不是白浪费时间学了么,对吧)
  • 如果有学习过react中的antd这个库的一定了解过
<Form.Item label='用户名' {...formItemLayout}>
    {
        getFieldDecorator('username',{
            rules:[
                {                    //重点start
                required:true,
                message:'用户名不能为空'
                }                    //重点end
                 ]
     })(
          <Input placeholder='请输入用户名' prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />} />
     )}

在使用这里面表单的时候,他就说把验证的规则配置为了一个对象,这也就使我们开发的时候只要去对应匹配使用,而不再用关注于更底层的逻辑,大大的加快了开发速度

  • 分享不易,感谢点赞^-^

猜你喜欢

转载自www.cnblogs.com/sunhang32/p/11832341.html