Javascript设计模式 - 08 - 策略模式
简介
策略模式定义了一系列算法,从概念上来说,所有的这些算法都是做相同的事情,只是实现不同,他可以以相同的方式调用所有的方法,减少了各种算法与使用算法之间的耦合,单独定义算法类,方便单元测试
不仅可以封装算法,也可以封装任何类型的规则
个人理解
将算法封装成功能块 – 一个具有多种键的json对象,这个功能块的调用使用统一的方法,指向的目标一致,目的是将算法的使用和算法的实现分离开,减少原程序的分支语句
一个机遇策略模式的程序至少由两部分组成
- 第一部分是一组策略类,策略类封装了具体的算法,并负责具体的计算过程
- 第二部分是环境类 Context,Context接受客户的请求,随后把请求委托给某一个策略类
代码
// 定义策略组,(将定义的一组算法封装起来)
var strategies = {
'S': function (amount) {
return amount * 1;
},
'A': function (amount) {
return amount * 2;
},
'B': function (amount) {
return amount * 3;
}
};
function calculate(level, amount) {
return strategies[level](amount);
}
console.log(calculate('B', 222)); // 666
function Valid(dom) {
this.dom = dom;
}
Valid.prototype.utils = {
isEmpty: function (flag, val) {
return !val === flag;
},
isTel: function (flag, val) {
var reg = /^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
return reg.test(val) === flag;
},
isMail: function (flag, val) {
var reg = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
return reg.test(val) === flag;
}
}
Valid.prototype.proof = function (config) {
// 验证
var val = this.dom.value;
var pass = true;
for (var conf in config) {
if (config.hasOwnProperty(conf)) {
var testFn = this.utils[conf];
var retVal = testFn(config[conf], val);
if (!retVal) {
pass = false;
}
}
}
return pass;
}
var dom = document.getElementById('input');
var input = new Valid(dom);
dom.onblur = function () {
var pass = input.proof({
isEmpty: false,
isTel: true,
isMail: false
})
console.log(pass);
}
文章列表
- javascript设计模式 – 设计原则
- JavaScript设计模式–高阶函数
- Javascript 设计模式 - 01 - 原型模式
- Javascript 设计模式 - 02 - 单例模式
- Javascript 设计模式 - 03 - 建造者模式
- Javascript 设计模式 - 04 - 工厂模式
- Javascript 设计模式 - 05 - 外观模式
- Javascript 设计模式 - 06 - 代理模式
- Javascript 设计模式 - 07 - 观察者模式(发布订阅模式)
- Javascript 设计模式 - 08 - 策略模式
- Javascript 设计模式 - 09 - 命令模式
- Javascript 设计模式 - 10 - 迭代器模式
- Javascript 设计模式 - 11 - 职责链模式
- Javascript 设计模式 - 12 - 适配器模式
- Javascript 设计模式 - 13 - 模板方法
- Javascript 设计模式 - 14 - 组合模式
- Javascript 设计模式 - 15 - 享元模式
- Javascript 设计模式 - 16 - 中介者模式
- Javascript 设计模式 - 17 - 装饰者模式
- Javascript 设计模式 - 18 - 状态模式