策略模式是指对一系列的算法定义,并将每一个算法封装起来,而且使它们还可以相互替换。策略模式让算法独立于使用它的客户而独立变化。
原文链接
优点:
- 策略模式利用组合、委托等技术和思想,可以避免很多if条件语句
- 策略模式提供了开放-封闭原则,使代码更容易理解和拓展
简单取值
很多例子�以绩效等级和薪资计算奖金为�说明
let calculateBouns = (level,salary)=>{
if(level=='A'){
return salary * 1.4;
}else if(level=='B'){
return salary * 1.3;
}else if(level=='C'){
return salary * 1.2;
}else{
return salary;
}
}
console.log(calculateBouns('A', 8000)); //11200
console.log(calculateBouns('C', 8000)); //9600
策略模式重构
//策略对象
class ruleA{
calculate(salary){
return salary * 1.4;
}
}
class ruleB{
calculate(salary){
return salary * 1.3;
}
}
class ruleC{
calculate(salary){
return salary * 1.2;
}
}
//奖金类
class Bouns{
constructor(){
this.salary = null;
this.level = null;
}
setLevel(level){
this.level = level;
}
setSalary(salary){
this.salary = salary;
}
getBouns(){
return this.level.calculate(this.salary);
}
}
let tom = new Bouns(),jerry = new Bouns();
//设置薪资
tom.setSalary(8000);
jerry.setSalary(10000);
//设置策略对象
tom.setLevel(new ruleA());
jerry.setLevel(new ruleA());
console.log(tom.getBouns()); //11200
console.log(jerry.getBouns()); //14000
jerry.setLevel(new ruleB());
console.log(jerry.getBouns()); //13000
表单
还有一种�理解策略模式的例子就是表单验证,通常会涉及到多个字段有效性判断
let form = document.getElementById("Form");
form.onsubmit = function(){
if(form.username.value == ''){
alert('用户名不能为空');
return false;
}else if(form.username.value.length <= 6){
alert('用户名长度不能小于6位');
return false;
}else if(form.password.value.length <= 6){
alert('密码长度不能小于6位');
return false;
}else if(!/(^1[3|5|8][0-9]{9}$)/.test(form.phone.value)){
alert("手机号码格式不正确");
return;
}else{
submit();
}
}
这样实现的代码的缺点:
- 函数体积臃肿,包含了很多if判断
- 函数缺乏弹性,违反了开放-封闭原则
- 函数复用性差,如果增加表单需要类似验证,只能复制一遍
策略模式实现表单验证
// 策略对象
let strategys = {
isEmpty: (value,errorMsg)=> {
if(value === '') {
return errorMsg;
}
},
// 限制最小长度
minLength: (value,length,errorMsg)=> {
if(value.length < length) {
return errorMsg;
}
},
// 手机号码格式
illegalPhone: (value,errorMsg)=> {
if(!/(^1[3|5|8][0-9]{9}$)/.test(value)) {
return errorMsg;
}
}
};
class Validator{
constructor(){
this.cache = []; //保存校验规则
}
addRule(dom,rules){
var self = this;
for(let i = 0, rule; rule = rules[i++]; ){
let strategyAry = rule.strategy.split(":");
let errorMsg = rule.errorMsg;
self.cache.push(function(){
let strategy = strategyAry.shift();
strategyAry.unshift(dom.value);
strategyAry.push(errorMsg);
return strategys[strategy].apply(dom,strategyAry);
});
}
}
check(){
for(let i = 0, fn; fn = this.cache[i++]; ) {
let msg = fn(); // 开始效验 并取得效验后的返回信息
if(msg) {
return msg;
}
}
}
}
// 代码调用
let form = document.getElementById("Form");
let validateFunc = function(){
let validator = new Validator(); // 实例化Validator
//添加一些校验规则
validator.addRule(form.username,[
{strategy: 'isEmpty',errorMsg:'用户名不能为空'},
{strategy: 'minLength:6',errorMsg:'用户名长度不能小于6位'}
]);
validator.addRule(form.password,[
{strategy: 'minLength:6',errorMsg:'密码长度不能小于6位'},
]);
validator.addRule(form.phone,[
{strategy: 'illegalPhone',errorMsg:'手机号格式不正确'},
]);
return validator.check();
};
form.onsubmit = function(){
let errorMsg = validateFunc();
if(errorMsg){
alert(errorMsg);
return false;
}else{
submit();
}
}
策略模式属于对象行为模式,主要针对一组算法,将每一个算法封装到具有共同接口的独立的类中,使得它们可以相互替换。