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 相关文章推荐
JavaScript和JQuery实用代码片段(一)
Apr 07 Javascript
jQuery+jRange实现滑动选取数值范围特效
Mar 14 Javascript
jquery插件jquery.nicescroll实现图片无滚动条左右拖拽的方法
Aug 10 Javascript
基于jquery实现页面滚动时顶部导航显示隐藏
Apr 20 Javascript
Javascript动画效果(2)
Oct 11 Javascript
JS正则匹配中文的方法示例
Jan 06 Javascript
node.js 中间件express-session使用详解
May 20 Javascript
微信小程序request出现400的问题解决办法
May 23 Javascript
JavaScript实现的数字与字符串转换功能示例
Aug 23 Javascript
十分钟带你快速了解React16新特性
Nov 10 Javascript
JS+HTML+CSS实现轮播效果
Nov 28 Javascript
微信小程序bindinput与bindsubmit的区别实例分析
Apr 17 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
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
DedeCMS 核心类TypeLink.class.php摘要笔记
2010/04/07 PHP
PHP中通过HTTP_USER_AGENT判断是否为手机移动终端的函数代码
2013/02/14 PHP
解析如何在PHP下载文件名中解决乱码的问题
2013/06/20 PHP
PHP中如何防止外部恶意提交调用ajax接口
2016/04/11 PHP
Windows2003下php5.4安装配置教程(Apache2.4)
2016/06/30 PHP
PHP实现文件上传下载实例
2016/10/18 PHP
Thinkphp5框架简单实现钩子(Hook)行为的方法示例
2019/09/03 PHP
JavaScript运行时库属性一览表
2014/03/14 Javascript
原生JavaScript+LESS实现瀑布流
2014/12/12 Javascript
JavaScript实现图片懒加载(Lazyload)
2016/11/28 Javascript
详解Vue中状态管理Vuex
2017/05/11 Javascript
JS实现十字坐标跟随鼠标效果
2017/12/25 Javascript
AngularJs用户输入动态模板XSS攻击示例详解
2018/04/21 Javascript
vue使用监听实现全选反选功能
2018/07/06 Javascript
玩转vue的slot内容分发
2018/09/22 Javascript
详解js location.href和window.open的几种用法和区别
2019/12/02 Javascript
Angular6项目打包优化的实现方法
2019/12/15 Javascript
vue绑定class的三种方法
2020/12/24 Vue.js
[04:55]完美世界副总裁蔡玮:DOTA2的自由、公平与信任
2013/12/18 DOTA
python正则表达式判断字符串是否是全部小写示例
2013/12/25 Python
Django中的CACHE_BACKEND参数和站点级Cache设置
2015/07/23 Python
Python登录并获取CSDN博客所有文章列表代码实例
2017/12/28 Python
python代码过长的换行方法
2018/07/19 Python
python中时间模块的基本使用教程
2019/05/14 Python
OpenCV模板匹配matchTemplate的实现
2019/10/18 Python
python 比较2张图片的相似度的方法示例
2019/12/18 Python
keras:model.compile损失函数的用法
2020/07/01 Python
Python定时任务框架APScheduler原理及常用代码
2020/10/05 Python
anaconda安装pytorch1.7.1和torchvision0.8.2的方法(亲测可用)
2021/02/01 Python
《草原的早晨》教学反思
2014/04/08 职场文书
员工保密承诺书
2014/05/28 职场文书
简单通用的简历自我评价
2014/09/21 职场文书
辞职书格式样本
2015/02/26 职场文书
推普标语口号大全
2015/12/26 职场文书
详解CSS中的特指度和层叠问题
2021/07/15 HTML / CSS