JS 设计模式三 -- 策略模式
策略模式
概念
定义一系列算法,把它们一个个封装起来。
将算法的使用与算法的实现分离开来
实现
// 加权映射关系
var levelMap = {
S: 10,
A: 8,
B: 6,
C: 4
}; // 组策略
var scoreLevel = {
basicScore: 80, S: function() {
return this.basicScore + levelMap['S'];
}, A: function() {
return this.basicScore + levelMap['A'];
}, B: function() {
return this.basicScore + levelMap['B'];
}, C: function() {
return this.basicScore + levelMap['C'];
}
} // 调用
function getScore(level) {
return scoreLevel[level] ? scoreLevel[level]() : 0;
} console.log(
getScore('S'),
getScore('A'),
getScore('B'),
getScore('C'),
getScore('D')
); // 90 88 86 84 0
在组合业务规则方面,比较经典的是表单的验证方法。
// 错误提示
var errorMsgs = {
default: '输入数据格式不正确',
minLength: '输入数据长度不足',
isNumber: '请输入数字',
required: '内容不为空'
}; // 规则集
var rules = {
minLength: function(value, length, errorMsg) {
if (value.length < length) {
return errorMsg || errorMsgs['minLength']
}
},
isNumber: function(value, errorMsg) {
if (!/\d+/.test(value)) {
return errorMsg || errorMsgs['isNumber'];
}
},
required: function(value, errorMsg) {
if (value === '') {
return errorMsg || errorMsgs['required'];
}
}
}; // 校验器
function Validator() {
this.items = [];
}; Validator.prototype = {
constructor: Validator, // 添加校验规则
add: function(value, rule, errorMsg) {
var arg = [value]; if (rule.indexOf('minLength') !== -1) {
var temp = rule.split(':');
arg.push(temp[1]);
rule = temp[0];
} arg.push(errorMsg); this.items.push(function() {
// 进行校验
return rules[rule].apply(this, arg);
});
}, // 开始校验
start: function() {
for (var i = 0; i < this.items.length; ++i) {
var ret = this.items[i](); if (ret) {
console.log(ret);
// return ret;
}
}
}
}; // 测试数据
function testTel(val) {
return val;
} var validate = new Validator(); validate.add(testTel('ccc'), 'isNumber', '只能为数字'); // 只能为数字
validate.add(testTel(''), 'required'); // 内容不为空
validate.add(testTel('123'), 'minLength:5', '最少5位'); // 最少5位
validate.add(testTel('12345'), 'minLength:5', '最少5位'); var ret = validate.start(); console.log(ret);
优缺点
优点:可以有效地避免多重条件语句,将一系列方法封装起来也更直观,利于维护
缺点:往往策略集会比较多,要事先就了解定义好所有的情况
JS 设计模式三 -- 策略模式的更多相关文章
- js设计模式总结-策略模式
策略模式 要解决的问题 当解决一个问题有多种方法时,选择使用哪种方法时就少不了要用大量的if语句进行判断,如果将这些方法的实现和判断语句放在一起实现就会产生问题, 比如增加一种的新的方法时,就不得不再 ...
- 浅谈js设计模式之策略模式
策略模式有着广泛的应用.本节我们就以年终奖的计算为例进行介绍. 很多公司的年终奖是根据员工的工资基数和年底绩效情况来发放的.例如,绩效为 S的人年终奖有 4倍工资,绩效为 A的人年终奖有 3倍工资,而 ...
- JavaScript设计模式之策略模式(学习笔记)
在网上搜索“为什么MVC不是一种设计模式呢?”其中有解答:MVC其实是三个经典设计模式的演变:观察者模式(Observer).策略模式(Strategy).组合模式(Composite).所以我今天选 ...
- 设计模式之策略模式和状态模式(strategy pattern & state pattern)
本文来讲解一下两个结构比较相似的行为设计模式:策略模式和状态模式.两者单独的理解和学习都是比较直观简单的,但是实际使用的时候却并不好实践,算是易学难用的设计模式吧.这也是把两者放在一起介绍的原因,经过 ...
- python设计模式之策略模式
每次看到项目中存在大量的if else代码时,都会心生一丝不安全感. 特别是产品给的需求需要添加或者更改一种if条件时,生怕会因为自己的疏忽而使代码天崩地裂,哈哈,本文的目的就是来解决这种不安全感的, ...
- JavaScript设计模式之策略模式【组合委托】
前言:语言只是工具,思想才是核心 今天要总结的是 策略模式 策略在开发中的应用非常广泛,所以也是非常常见且使用的设计模式. 在实际开发中,往往在实现一个功能时,有多种解决方案可行. 常见场景: 解压: ...
- 设计模式:策略模式(Strategy)
定 义:它定义了算法家族,分别封装起来,让它们之间可以互相替换,此模式让算法的变化, 不会影响到使用算法的客户. 示例:商场收银系统,实现正常收费.满300返100.打8折.......等不同收费 ...
- JS设计模式——5.单体模式
JS设计模式——5.单体模式 http://www.cnblogs.com/JChen666/p/3610585.html 单体模式的优势 用了这么久的单体模式,竟全然不知!用它具体有哪些好处呢? ...
- PHP设计模式之策略模式
前提: 在软件开发中也常常遇到类似的情况,实现某一个功能有多种算法或者策略,我们可以根据环境或者条件的不同选择不同的算法或者策略来完成该功能.如查 找.排序等,一种常用的方法是硬编码(Hard Cod ...
随机推荐
- Docker容器监控(十)--技术流ken
docker自带的监控命令 docker自带了三个监控命令即ps, top, stats ps docker ps 可以帮助我们很快的了解当前正在运行的容器 -a:会显示已经停掉的容器 [root@h ...
- Linux中more和less命令用法
一.more命令 more功能类似 cat ,cat命令是整个文件的内容从上到下显示在屏幕上. more会以一页一页的显示方便使用者逐页阅读,而最基本的指令就是按空白键(space)就往下一页显示,按 ...
- Java开发笔记(四十八)类的简单继承
前面介绍了类的基本用法,主要是如何封装一个类的各项要素,包括成员属性.成员方法.构造方法等,想必大家对类的简单运用早已驾轻就熟.所谓“物以类聚,人以群分”,之所以某些事物会聚在一起,乃是因为它们拥有类 ...
- Rxjs常用operators
本文使用的是angular6内置的rxjs,版本号为6.3.3 concat 通过顺序地发出多个 Observables 的值将它们连接起来,一个接一个的. 参数: 名称 类型 属性 描述 other ...
- 华为防火墙USG6000V使用总结
问题1.ge 1/0/0 的ip地址 20.0.0.2 ,从直连的对端20.0.0.1 无法ping. 但是从防火墙ping对端却是可以ping通? 原因: 华为新一代的防火墙,默认情况下,只有0口是 ...
- Android为TV端助力listview 非常重要的几个属性
首先是stackFromBottom属性,这只该属性之后你做好的列表就会显示你列表的最下面,值为true和false Android:stackFromBottom="true" ...
- ionic3 Modal组件
Modal组件主要用来弹出一些临时的框,如登录,注册的时候用 弹出页面html页面 <button ion-button small outline color="he" ...
- 第四篇 CSS
在标签上设置style属性: background-color:#2459a2: height:48px: ... 编写CSS样式: 如何注释:/* 或 */ 一. 在标签的属性中编写 <!DO ...
- macos 安装sublime text 3,如何安装插件
1. 上面的代码如下: import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1 ...
- Cygwin 编译 ffmpeg
1.在官网下载linux下的压缩包 https://ffmpeg.zeranoe.com/builds/source/ffmpeg/ffmpeg-3.2.4.tar.xz 2.进入cygwin,假定将 ...