策略模式是指对一系列的算法定义,并将每一个算法封装起来,而且使它们还可以相互替换。策略模式让算法独立于使用它的客户而独立变化。
策略模式利用组合、委托等技术和思想,可以避免很多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)); //11200console.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()); //11200console.log(jerry.getbouns()); //14000jerry.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(); } }
策略模式属于对象行为模式,主要针对一组算法,将每一个算法封装到具有共同接口的独立的类中,使得它们可以相互替换。
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
关于js继承的详解
node的文件批量重命名
以上就是javascript的策略模式的详细内容。