策略模式概述

策略模式

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

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

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

举例说明使用

• 现在我们要做一个表单验证
  正常新情况下

$('#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)' }} />} />
     )}

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

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