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 相关文章推荐
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
Mar 24 Javascript
js 获取radio按钮值的实例
Aug 17 Javascript
jquery validation验证身份证号,护照,电话号码,email(实例代码)
Nov 06 Javascript
JavaScript 实现简单的倒计时弹窗DEMO附图
Mar 05 Javascript
Javascript封装DOMContentLoaded事件实例
Jun 12 Javascript
jQuery实现向下滑出的二级菜单效果实例
Aug 22 Javascript
ES6学习教程之模板字符串详解
Oct 09 Javascript
webpack 插件html-webpack-plugin的具体使用
Apr 09 Javascript
vue+springboot实现项目的CORS跨域请求
Sep 05 Javascript
js实现京东秒杀倒计时功能
Jan 21 Javascript
关于vue 结合原生js 解决echarts resize问题
Jul 26 Javascript
el-table表头根据内容自适应完美解决表头错位和固定列错位
Jan 07 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实现 上一篇、下一篇的代码
2012/09/29 PHP
PHP多线程之内部多线程实例分析
2015/03/09 PHP
[原创]PHPCMS遭遇会员投稿审核无效的解决方法
2017/01/11 PHP
[企业公众号]升级到[企业微信]之后发送消息失败的解决方法
2017/06/30 PHP
PHP 实现页面静态化的几种方法
2017/07/23 PHP
php 获取xml接口数据的处理方法
2018/05/31 PHP
PHP与Web页面的交互示例详解二
2020/08/04 PHP
php实现图片压缩处理
2020/09/09 PHP
srcElement表格样式
2006/09/03 Javascript
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
用JS判断IE版本的代码 超管用!
2011/08/09 Javascript
Javascript 绘制 sin 曲线过程附图
2014/08/21 Javascript
node.js操作mongoDB数据库示例分享
2014/11/26 Javascript
Jquery实现由下向上展开效果的例子
2014/12/08 Javascript
简介JavaScript中的setTime()方法的使用
2015/06/11 Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
2016/06/01 Javascript
JS 拼凑字符串的简单实例
2016/09/02 Javascript
webuploader模态框ueditor显示问题解决方法
2016/12/27 Javascript
JavaScript方法_动力节点Java学院整理
2017/06/28 Javascript
JS出现404错误原理及解决方案
2020/07/01 Javascript
Vue ElementUI实现:限制输入框只能输入正整数的问题
2020/07/31 Javascript
[20:46]Ti4循环赛第三日VG vs DK
2014/07/12 DOTA
[04:59]2018DOTA2亚洲邀请赛 4.7 Mineski夺冠时刻
2018/04/09 DOTA
python中使用urllib2伪造HTTP报头的2个方法
2014/07/07 Python
Python新手在作用域方面经常容易碰到的问题
2015/04/03 Python
Python中的map()函数和reduce()函数的用法
2015/04/27 Python
python中WSGI是什么,Python应用WSGI详解
2017/11/24 Python
Python tkinter事件高级用法实例
2018/01/31 Python
python装饰器相当于函数的调用方式
2019/12/27 Python
Pytorch DataLoader 变长数据处理方式
2020/01/08 Python
详解Python的爬虫框架 Scrapy
2020/08/03 Python
Banana Republic英国官网:香蕉共和国,GAP集团旗下偏贵族风
2018/04/24 全球购物
捷克购买家具网站:JENA nábytek
2020/03/19 全球购物
简述synchronized和java.util.concurrent.locks.Lock的异同
2014/12/08 面试题
消防安全汇报材料
2014/02/08 职场文书
2015年度保密工作总结
2015/04/24 职场文书