热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

什么是TypeScript策略模式

本篇内容介绍了“什么是TypeScript策略模式”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如

本篇内容介绍了“什么是TypeScript策略模式”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

 一、什么是策略模式

定义: 定义一系列的算法,把它们一个个封装起来,并且使它们可以互相替换。

什么是TypeScript策略模式

一个基于策略模式的程序至少由两部分组成。

第一个部分是一组策略类 strategy,策略类封装了具体的算法,并负责具体的计算过程。

第二个部分是环境类 Context , Context 接受客户的请求,随后把请求委托给某一个策略类

二、策略模式的作用

在现实中,很多时候也有多种途径到达同一个目的地。比如我们要去某个地方旅游,可以根据具体的实际情况来选择出行的线路。

  • 如果没有时间但是不在乎钱,可以选择坐飞机。

  • 如果没有钱,可以选择坐大巴或者火车。

  • 如果再穷一点,可以选择骑自行车。

什么是TypeScript策略模式

Untitled Diagram.png

在程序设计中,我们也常常遇到类似的情况,要实现某一个功能有多种方案可以选择。比如一个压缩文件的程序,既可以选择zip算法,也可以选择gzip算法。

这些算法灵活多样,而且可以随意互相替换。这种解决方案就是本章将要介绍的策略模式。

三、策略模式案例

1、计算奖金

案例描述:某公司的年终奖是根据员工的工资基数和年底绩效来发放的。例如,绩效为S的人年终奖有4倍工资,绩效为A的人年终奖有3倍工资,绩效为B的人年终奖有2倍工资,财务部要求我们提供一段代码,来方便他们计算员工的年终奖。

什么是TypeScript策略模式

计算奖金:最初版本

const calculateBouns = function(level: string,salary: number) :number {     if (level === 'S') {       return salary * 4;     }     if (level === 'A') {       return salary * 3;     }     if (level === 'B') {       return salary * 2;     }  }  console.log(calculateBouns('S',4000));  // 输出16000  console.log(calculateBouns('A',3000));  // 输出9000  console.log(calculateBouns('B',2000));  // 输出4000

** 分析 **:

  • calculateBonus 函数比较庞大,包含了很多 if-else 语句,这些语句需要覆盖所有的逻辑分支。

  • calculateBonus 函数缺乏弹性,如果增加了一种新的绩效等级C,或者想把绩效S的奖金系数改为5,那我们必须深入 calculateBonus  函数的内部实现,这是违反开放-封闭原则的。

  • 算法的复用性差,如果在程序的其他地方需要重用这些计算奖金的算法呢?我们的选择只有复制和粘贴。

计算奖金:(使用策略模式)面向对象完善版本

// 计算奖金:面向对象完善版本 class PerformanceS {     calculate(salary: number): number {         return salary * 4     } }  class PerformanceA {     calculate(salary: number): number {         return salary * 3     } }  class PerformanceB {     calculate(salary: number): number {         return salary * 2     } }  interface strategy {     calculate: (salary: number) => number; }

先创建一个 bonus(Context)对象,并且给 bonus 对象设置一些原始的数据,比如员工的原始工资数额。

接下来把某个计算奖金的策略对象也传入bonus对象内部保存起来。

当调用 bonus.getBonus()来计算奖金的时候,bonus对象本身并没有能力进行计算,

而是把请求委托给了之前保存好的策略对象:

// Context 对象 class Bouns {      public salary: number; // 原始工资     public strategy: strategy; // 绩效等级对应的策略对象      setSalary(salary: number) {         this.salary = salary; // 设置员工的原始工资     }      setStrategy(strategy: strategy) {       this.strategy = strategy // 设置员工绩效等级对应的策略对象     }      getBouns() { // 取得奖金数额         return this.strategy.calculate(this.salary); // 把计算奖金的操作委托给对应的策略对象     } }  const bouns = new Bouns();  bouns.setSalary(4000); bouns.setStrategy(new PerformanceS()); console.log(bouns.getBouns());  // 输出16000  bouns.setSalary(3000); bouns.setStrategy(new PerformanceA()); console.log(bouns.getBouns());  // 输出9000  bouns.setSalary(2000); bouns.setStrategy(new PerformanceB()); console.log(bouns.getBouns());  // 输出4000

我们再来回顾一下策略模式的思想:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换。这句话如果说得更详细一点,就是:定义一系列的算法,把它们各自封装成策略类,算法被封装在策略类内部的方法里。在客户对  Context发起请求的时候,Context总是把请求委托给这些策略对象中间的某一个进行计算。

计算奖金:Javascript的完善版本

// 计算奖金:Javascript的完善版本 // 在Javascript语言中,函数也是对象,所以更简单和直接的做法是把strategy直接定义为函数 interface strategy {     S:(salary: number) => number;     A:(salary: number) => number;     B:(salary: number) => number; }  const strategy: strategy= {     S: function(salary: number): number {       return salary * 4;     },     A: function(salary: number): number {       return salary * 3;     },     B: function(salary: number): number {       return salary * 2;     } } // Context   var calcluateBouns = function(level: string,salary: number): number{     return strategy[level](salary);   }   console.log(calcluateBouns('S',4000));  // 输出16000   console.log(calcluateBouns('A',3000));  // 输出9000   console.log(calcluateBouns('B',2000));  // 输出4000

2、表单验证

  1. 鸿蒙官方战略合作共建——HarmonyOS技术社区

  2. 用户名(验证是否为空)

  3. 密码(验证长度不能小于6位)

  4. 手机号(验证是否是手机号格式)

表单验证:最初版本

? ?        ? 请输入用户名: 请输入密码:?   请输入手机号码:?        ?         ?           ?      

分析:

  • registerForm.onsubmit函数比较庞大,包含了很多if-else语句,这些语句需要覆盖所有的校验规则。

  • registerForm.onsubmit函数缺乏弹性,如果增加了一种新的校验规则,或者想把密码的长度校验从6改成8,我们都必须深入  registerForm.onsubmit函数的内部实现,这是违反开放—封闭原则的。

  • 算法的复用性差,如果在程序中增加了另外一个表单,这个表单也需要进行一些类似的校验,那我们很可能将这些校验逻辑复制得漫天遍野

表单验证:策略模式案例

// 策略对象 const strategies: Object = {     isEmpty(value: string, errMsg: string): string {       if(value === '') {         return errMsg       }     },     minLength(value: string, length: number, errMsg: string) : string{       if (value.length;      constructor() {         this.cache = []     }      add(value: string, rule: string, msg: string) {         const params: Array = rule.split(':');         this.cache.push(() => {             const strategy: string = params.shift();             params.unshift(value);             params.push(msg);             return strategies[strategy].apply(null, params)         })     }      check(): string {         let value: Function;         for (value of this.cache) {             const msg = value();             if (msg) {                 return msg             }         }     } }    var submitBtn = document.getElementById('submitBtn'); var registerForm = document.getElementById('registerForm'); var validateFunc = function() {     var validator = new Validator();   // 添加规则     validator.add(registerForm.username.value,'isEmpty','用户名不能为空');     validator.add(registerForm.password.value,'minLength:6','密码长度不能小于6位');     validator.add(registerForm.phone.value,'isMobile','手机号格式不正确');      // 校验结果     var errMsg = validator.check();     return errMsg; }   submitBtn.onclick = function() {     var errMsg = validateFunc();     if(errMsg) {       console.log(errMsg);       return false;     } else {       console.log('表单验证成功')     }   }

四、策略模式的优缺点

优点:

策略模式利用组合、委托和多态等技术和思想,可以有效地避免多重条件选择语句。

策略模式提供了对开放—封闭原则的完美支持,将算法封装在独立的 strateg (策略)中,使得它们易于切换,易于理解,易于扩展。

策略模式中的算法也可以复用在系统的其他地方,从而避免许多重复的复制粘贴工作。

在策略模式中利用组合和委托来让 Context 拥有执行算法的能力,这也是继承的一种更轻便的替代方案。

缺点:

1、使用策略模式会在程序中增加许多策略类或者策略对象,但实际上这比把它们负责的逻辑堆砌在 Context 中要好。

2、要使用策略模式,必须了解所有的 strategy ,必须了解各个 strategy  之间的不同点,这样才能选择一个合适的strategy。比如,我们要选择一种合适的旅游出行路线,必须先了解选择飞机、火车、自行车等方案的细节。此时strategy要向客户暴露它的所有实现,这是违反最少知识原则的。

“什么是TypeScript策略模式”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程笔记网站,小编将为大家输出更多高质量的实用文章!


推荐阅读
  • 本文介绍了OkHttp3的基本使用和特性,包括支持HTTP/2、连接池、GZIP压缩、缓存等功能。同时还提到了OkHttp3的适用平台和源码阅读计划。文章还介绍了OkHttp3的请求/响应API的设计和使用方式,包括阻塞式的同步请求和带回调的异步请求。 ... [详细]
  • 目录实现效果:实现环境实现方法一:基本思路主要代码JavaScript代码总结方法二主要代码总结方法三基本思路主要代码JavaScriptHTML总结实 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • 本文讨论了在手机移动端如何使用HTML5和JavaScript实现视频上传并压缩视频质量,或者降低手机摄像头拍摄质量的问题。作者指出HTML5和JavaScript无法直接压缩视频,只能通过将视频传送到服务器端由后端进行压缩。对于控制相机拍摄质量,只有使用JAVA编写Android客户端才能实现压缩。此外,作者还解释了在交作业时使用zip格式压缩包导致CSS文件和图片音乐丢失的原因,并提供了解决方法。最后,作者还介绍了一个用于处理图片的类,可以实现图片剪裁处理和生成缩略图的功能。 ... [详细]
  • 简述在某个项目中需要分析PHP代码,分离出对应的函数调用(以及源代码对应的位置)。虽然这使用正则也可以实现,但无论从效率还是代码复杂度方面考虑ÿ ... [详细]
  • IamgettingaUnicodeerror:UnicodeEncodeError:charmapcodeccantencodecharacteru\xa9in ... [详细]
  • 开发中,EXT封装的.NET控件,使用了ExtJsExtenderControl的开源控件,发现个问题,就是每次控件加载,都需要调EXT_ALL.JS文件,600K,导致页面加载很慢。想对这个问题进行 ... [详细]
  • 1.man(相当于cmd--help)对不熟悉的命令想查询详细使用方法的帮助解释可以使用eg:manls就可以查看ls相关的用法注: ... [详细]
  • GetWindowLong函数
    今天在看一个代码里头写了GetWindowLong(hwnd,0),我当时就有点费解,靠,上网搜索函数原型说明,死活找不到第 ... [详细]
  • 闭包一直是Java社区中争论不断的话题,很多语言都支持闭包这个语言特性,闭包定义了一个依赖于外部环境的自由变量的函数,这个函数能够访问外部环境的变量。本文以JavaScript的一个闭包为例,介绍了闭包的定义和特性。 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 一句话解决高并发的核心原则
    本文介绍了解决高并发的核心原则,即将用户访问请求尽量往前推,避免访问CDN、静态服务器、动态服务器、数据库和存储,从而实现高性能、高并发、高可扩展的网站架构。同时提到了Google的成功案例,以及适用于千万级别PV站和亿级PV网站的架构层次。 ... [详细]
  • 本文介绍了Android中的assets目录和raw目录的共同点和区别,包括获取资源的方法、目录结构的限制以及列出资源的能力。同时,还解释了raw目录中资源文件生成的ID,并说明了这些目录的使用方法。 ... [详细]
  • 如何压缩网站页面以减少页面加载时间
    本文介绍了影响网站打开时间的两个因素,即网页加载速度和网站页面大小。重点讲解了如何通过压缩网站页面来减少页面加载时间。具体包括图片压缩、Javascript压缩、CSS压缩和HTML压缩等方法,并推荐了相应的压缩工具。此外,还提到了一款Google Chrome插件——网页加载速度分析工具Speed Tracer。 ... [详细]
  • 用SpringBoot实现万能文件在线预览
    推荐一个用SpringBoot搭建的文档在线预览解决方案:kkFileView,一款成熟且开源的文件文档在线预览项目解决方案,对标业内付 ... [详细]
author-avatar
阿尔及利亚奥兰叉
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有