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控制listbox中项的移动并排序的实现代码
Sep 28 Javascript
THREE.JS入门教程(5)你应当知道的十件事
Jan 24 Javascript
JS的document.all函数使用示例
Dec 30 Javascript
iframe父页面获取子页面参数的方法
Feb 21 Javascript
jQuery中eq()方法用法实例
Jan 05 Javascript
JS判断是否360安全浏览器极速内核的方法
Jan 29 Javascript
jquery任意位置浮动固定层插件用法实例
May 29 Javascript
JavaScript中的fontsize()方法使用详解
Jun 08 Javascript
Vue 固定头 固定列 点击表头可排序的表格组件
Nov 25 Javascript
JS日程管理插件FullCalendar中文说明文档
Feb 06 Javascript
详解vue-cli + webpack 多页面实例应用
Apr 25 Javascript
JavaScript实现拖拽和缩放效果
Aug 24 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学习之输出字符串(echo,print,printf,print_r和var_dump)
2011/04/17 PHP
php session安全问题分析
2011/06/24 PHP
php实现根据url自动生成缩略图的方法
2014/09/23 PHP
php实现监控varnish缓存服务器的状态
2014/12/30 PHP
php防止sql注入的方法详解
2017/02/20 PHP
现如今最流行的JavaScript代码规范
2014/03/08 Javascript
一段非常简单的js判断浏览器的内核
2014/08/17 Javascript
浅谈JavaScript function函数种类
2014/12/29 Javascript
window.location.reload 刷新使用分析(去对话框)
2015/11/11 Javascript
Bootstrap Table表格一直加载(load)不了数据的快速解决方法
2016/09/17 Javascript
Angular的模块化(代码分享)
2016/12/26 Javascript
Bootstrap 3浏览器兼容性问题及解决方案
2017/04/11 Javascript
JS 仿支付宝input文本输入框放大组件的实例
2017/11/14 Javascript
react实现菜单权限控制的方法
2017/12/11 Javascript
webpack打包并将文件加载到指定的位置方法
2018/02/22 Javascript
微信小程序-API接口安全详解
2019/07/16 Javascript
javascript面向对象创建对象的方式小结
2019/07/29 Javascript
详解Vue+elementUI build打包部署后字体图标丢失问题
2020/07/13 Javascript
JS实现小米轮播图
2020/09/21 Javascript
深入探究Python中变量的拷贝和作用域问题
2015/05/05 Python
Python中的hypot()方法使用简介
2015/05/18 Python
Python制作钉钉加密/解密工具
2016/12/07 Python
python打包生成的exe文件运行时提示缺少模块的解决方法
2018/10/31 Python
Python绘制堆叠柱状图的实例
2019/07/09 Python
如何用python免费看美剧
2020/08/11 Python
Django解决frame拒绝问题的方法
2020/12/18 Python
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
css3与html5实现响应式导航菜单(导航栏)效果分享
2014/02/12 HTML / CSS
Css3实现无缝滚动防抖
2020/09/14 HTML / CSS
手对手的教你用canvas画一个简单的海报的方法示例
2018/12/10 HTML / CSS
Html5让容器充满屏幕高度或自适应剩余高度的布局实现
2020/05/14 HTML / CSS
美国Curacao百货连锁店网站:iCuracao.com
2019/07/20 全球购物
以思科路由器为例你写下单臂路由的配置命令
2013/08/03 面试题
2014年五四青年节活动策划书
2014/04/22 职场文书
财务会计实训报告
2014/11/05 职场文书
MongoDB支持的索引类型
2022/04/11 MongoDB