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的仿百度搜索框效果代码
Apr 11 Javascript
js操作checkbox遇到的问题解决
Jun 29 Javascript
javascript简单实现表格行间隔显示颜色并高亮显示
Nov 29 Javascript
js交换排序 冒泡排序算法(Javascript版)
Oct 04 Javascript
JQuery中serialize()用法实例分析
Feb 06 Javascript
AspNet中使用JQuery上传插件Uploadify详解
May 20 Javascript
js实现仿京东2级菜单效果(带延时功能)
Aug 27 Javascript
js return返回多个值,通过对象的属性访问方法
Feb 21 Javascript
浅谈webpack编译vue项目生成的代码探索
Dec 11 Javascript
JS XMLHttpRequest原理与使用方法深入详解
Apr 30 Javascript
vue+canvas实现移动端手写签名
May 21 Javascript
JavaScript原型链中函数和对象的理解
Jun 16 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 fsockopen写的HTTP下载的类
2007/02/22 PHP
PHP使用SOAP调用.net的WebService数据
2013/11/12 PHP
php实现文件编码批量转换
2014/03/10 PHP
destoon复制新模块的方法
2014/06/21 PHP
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
PHP对文件夹递归执行chmod命令的方法
2015/06/19 PHP
Laravel利用gulp如何构建前端资源详解
2018/06/03 PHP
Javascript中暂停功能的实现代码
2007/03/04 Javascript
jquery实现表格奇数偶数行不同样式(有图为证及实现代码)
2013/01/23 Javascript
JS使用ajax从xml文件动态获取数据显示的方法
2015/03/24 Javascript
JS中frameset框架弹出层实例代码
2016/04/01 Javascript
jQuery添加和删除输入文本框标签代码
2016/05/20 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
2016/08/29 Javascript
vue.js通过自定义指令实现数据拉取更新的实现方法
2016/10/18 Javascript
使用vue.js编写蓝色拼图小游戏
2017/03/17 Javascript
JS实现用特殊符号替换字符串的中间部分区域的实例代码
2018/07/24 Javascript
js实现倒计时秒杀效果
2020/03/25 Javascript
jQuery Datatables 动态列+跨列合并实现代码
2020/01/30 jQuery
基于vue 动态菜单 刷新空白问题的解决
2020/08/06 Javascript
手写Vue源码之数据劫持示例详解
2021/01/04 Vue.js
关于javascript中的promise的用法和注意事项(推荐)
2021/01/15 Javascript
python中list循环语句用法实例
2014/11/10 Python
Python实现向QQ群成员自动发邮件的方法
2014/11/19 Python
让python 3支持mysqldb的解决方法
2017/02/14 Python
python3.6 +tkinter GUI编程 实现界面化的文本处理工具(推荐)
2017/12/20 Python
python读取一个目录下所有txt里面的内容方法
2018/06/23 Python
Python使用gRPC传输协议教程
2018/10/16 Python
浅谈pycharm的xmx和xms设置方法
2018/12/03 Python
通过实例了解python property属性
2019/11/01 Python
Pycharm 使用 Pipenv 新建的虚拟环境(图文详解)
2020/04/16 Python
Mountain Warehouse波兰官方网站:英国户外品牌
2019/08/29 全球购物
文明礼仪标语
2014/06/13 职场文书
五年级学生评语大全
2014/12/26 职场文书
python中__slots__节约内存的具体做法
2021/07/04 Python
MySQL空间数据存储及函数
2021/09/25 MySQL
GPU服务器的多用户配置方法
2022/07/07 Servers