javascript设计模式 ? 策略模式原理与用法实例分析


Posted in Javascript onApril 21, 2020

本文实例讲述了javascript设计模式 ? 策略模式原理与用法。分享给大家供大家参考,具体如下:

介绍:策略模式中可以定义一些独立的类来封装不同的算法,每一个类封装一种具体的算法。在这里,每一种算法的封装都可以称之为一种策略。策略模式的主要目的是将算法的定义与使用分开。

定义:定义一系列算法类,将每一个算法封装起来,并让它们可以相互替换。策略模式让算法独立与使用它的客户而变化,也称为政策模式。策略模式是一种对象行为型模式。

场景:使用策略模式实现一个加减乘除的工具类,将四个算法进行封装。

示例:

var AddStrategy = function(){
  this.caculate = function(num1, num2){
    return num1 + num2;
  }
}
 
var SubStrategy = function(){
  this.caculate = function(num1, num2){
    return num1 - num2;
  }
}
 
var MulStrategy = function(){
  this.caculate = function(num1, num2){
    return num1 * num2;
  }
}
 
var DivStrategy = function(){
  this.caculate = function(num1, num2){
    return num1 / num2;
  }
}
 
var Context = function(strategy){
  var _strategy = strategy;
 
  this.executeStrategy = function(num1, num2){
    return _strategy.caculate(num1, num2)
  }
}
var add = new Context(new AddStrategy());
var sub = new Context(new SubStrategy());
var mul = new Context(new MulStrategy());
var div = new Context(new DivStrategy());
 
console.log('1 + 2 = ' + add.executeStrategy(1, 2));
console.log('5 - 1 = ' + sub.executeStrategy(5, 1));
console.log('3 * 2 = ' + mul.executeStrategy(3, 2));
console.log('8 / 2 = ' + div.executeStrategy(8, 2));
 
// 1 + 2 = 3
// 5 - 1 = 4
// 3 * 2 = 6
// 8 / 2 = 4

在这个例子里,Context称之为环境类,环境类是使用算法的角色,他在解决某个问题时可以采用多种策略。我们的例子里,根据传递的策略不同,导致Context作出不同的处理方式。
DivStrategy,MulStrategy,SubStrategy,AddStrategy称为策略类,用来实现具体策略。

策略模式总结:

优点:

* 提供了开关原则的完美支持,可以再不修改原有系统基础上进行扩展
* 策略模式提供了一种可以替换继承关系的办法
* 使用策略模式可以避免多重条件选择语句。

缺点:

* 客户端必须知道所有的策略类,并自行选择需要使用哪一个策略
* 策略模式将造成系统产生很多策略类,任何细小的变化都导致系统需要新增一个新的策略类
* 客户端每次只能选择使用一个策略类

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery 自定义CircleAnimation,Animate方法学习笔记
Jul 10 Javascript
JS打印gridview实现原理及代码
Feb 05 Javascript
js实现可拖动DIV的方法
Dec 17 Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
Oct 17 Javascript
jQuery+css实现百度百科的页面导航效果
Dec 16 Javascript
js实现上一页下一页的效果【附代码】
Mar 10 Javascript
详解利用 Express 托管静态文件的方法
Sep 18 Javascript
React 组件间的通信示例
Jun 14 Javascript
Vue js 的生命周期(看了就懂)(推荐)
Mar 29 Javascript
Vue form表单动态添加组件实战案例
Sep 02 Javascript
vue轮播组件实现$children和$parent 附带好用的gif录制工具
Sep 26 Javascript
ES5和ES6中类的区别总结
Dec 21 Javascript
javascript设计模式 ? 备忘录模式原理与用法实例分析
Apr 21 #Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Apr 20 #Javascript
Vue的全局过滤器和私有过滤器的实现
Apr 20 #Javascript
深入浅析JavaScript中的in关键字和for-in循环
Apr 20 #Javascript
vue实现购物车功能(商品分类)
Apr 20 #Javascript
vue实现淘宝购物车功能
Apr 20 #Javascript
javascript利用键盘控制小方块的移动
Apr 20 #Javascript
You might like
解析php根据ip查询所在地区(非常有用,赶集网就用到)
2013/07/01 PHP
thinkPHP+PHPExcel实现读取文件日期的方法(含时分秒)
2016/07/07 PHP
thinkphp在php7环境下提示Cannot use ‘String’ as class name as it is reserved的解决方法
2016/09/30 PHP
PHP实现chrome表单请求数据转换为接口使用的json数据
2021/03/04 PHP
在js(jquery)中获得文本框焦点和失去焦点的方法
2012/12/04 Javascript
javascript 星级评分效果(手写)
2012/12/24 Javascript
jquery必须知道的一些常用特效方法及使用示例(整理)
2013/06/24 Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
2013/07/10 Javascript
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
2014/08/30 Javascript
介绍一个简单的JavaScript类框架
2015/06/24 Javascript
jQuery实现标题有打字效果的焦点图代码
2015/11/16 Javascript
jQuery短信验证倒计时功能实现方法详解
2016/05/25 Javascript
JavaScript之cookie技术详解
2016/11/18 Javascript
详解Jquery的事件操作和文档操作
2016/12/19 Javascript
基于 flexible 的 Vue 组件:Toast -- 显示框效果
2017/12/26 Javascript
vue.js的双向数据绑定Object.defineProperty方法的神奇之处
2019/01/18 Javascript
详解Vue.js 作用域、slot用法(单个slot、具名slot)
2019/10/15 Javascript
vue+webpack 更换主题N种方案优劣分析
2019/10/28 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
Vue+Element-U实现分页显示效果
2020/11/15 Javascript
videocapture库制作python视频高速传输程序
2013/12/23 Python
用pickle存储Python的原生对象方法
2017/04/28 Python
matplotlib绘图实例演示标记路径
2018/01/23 Python
详解Python中的分组函数groupby和itertools)
2018/07/11 Python
Python实现定时执行任务的三种方式简单示例
2019/03/30 Python
Flask框架学习笔记之使用Flask实现表单开发详解
2019/08/12 Python
基于HTML5 audio元素播放声音jQuery小插件
2011/05/11 HTML / CSS
全球知名旅游社区巴西站点:TripAdvisor巴西
2016/07/21 全球购物
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
台湾深度自由行旅游平台:Tripbaa趣吧
2017/10/10 全球购物
马来西亚网上购物:Youbeli
2018/03/30 全球购物
HomeAway澳大利亚:预订你的度假屋,公寓、度假村、别墅等
2019/02/20 全球购物
留学自荐信写作方法
2014/01/27 职场文书
工地安全质量标语
2014/06/07 职场文书
绵山导游词
2015/02/05 职场文书
复兴之路纪录片观后感
2015/06/02 职场文书