JS设计模式(13)状态模式

什么是状态模式?

定义:将事物内部的每个状态分别封装成类,内部状态改变会产生不同行为。

主要解决:对象的行为依赖于它的状态(属性),并且可以根据它的状态改变而改变它的相关行为。

何时使用:代码中包含大量与对象状态有关的条件语句。

如何解决:将各种具体的状态类抽象出来。

应用实例: 1、打篮球的时候运动员可以有正常状态、不正常状态和超常状态。 2、曾侯乙编钟中,'钟是抽象接口','钟A'等是具体状态,'曾侯乙编钟'是具体环境(Context)。

优点: 1、封装了转换规则。 2、枚举可能的状态,在枚举状态之前需要确定状态种类。 3、将所有与某个状态有关的行为放到一个类中,并且可以方便地增加新的状态,只需要改变对象状态即可改变对象的行为。 4、允许状态转换逻辑与状态对象合成一体,而不是某一个巨大的条件语句块。 5、可以让多个环境对象共享一个状态对象,从而减少系统中对象的个数。

缺点: 1、状态模式的使用必然会增加系统类和对象的个数。 2、状态模式的结构与实现都较为复杂,如果使用不当将导致程序结构和代码的混乱。 3、状态模式对"开闭原则"的支持并不太好,对于可以切换状态的状态模式,增加新的状态类需要修改那些负责状态转换的源代码,否则无法切换到新增状态,而且修改某个状态类的行为也需修改对应类的源代码。

使用场景: 1、行为随状态改变而改变的场景。 2、条件、分支语句的代替者。

注意事项:在行为受状态约束的时候使用状态模式,而且状态不超过 5 个。

 

场景 demo

某某牌电灯,按一下按钮打开弱光,按两下按钮打开强光,按三下按钮关闭灯光。

// 将状态封装成不同类
const weakLight = function(light) {this.light = light
}weakLight.prototype.press = function() {console.log('打开强光')this.light.setState(this.light.strongLight)
}const strongLight = function(light) {this.light = light
}strongLight.prototype.press = function() {console.log('关灯')this.light.setState(this.light.offLight)
}const offLight = function(light) {this.light = light
}offLight.prototype.press = function() {console.log('打开弱光')this.light.setState(this.light.weakLight)
}const Light = function() {this.weakLight = new weakLight(this)this.strongLight = new strongLight(this)this.offLight = new offLight(this)this.currentState = this.offLight          // 初始状态
}Light.prototype.init = function() {const btn = document.createElement('button')btn.innerHTML = '按钮'document.body.append(btn)const self = thisbtn.addEventListener('click', function() {self.currentState.press()})
}Light.prototype.setState = function(state) { // 改变当前状态this.currentState = state
}const light = new Light()
light.init()// 打开弱光
// 打开强光
// 关灯

 

非面向对象实现的状态模式

借助于 JavaScript 的委托机制,可以像如下实现状态模式:

const obj = {'weakLight': {press: function() {console.log('打开强光')this.currentState = obj.strongLight}},'strongLight': {press: function() {console.log('关灯')this.currentState = obj.offLight}},'offLight': {press: function() {console.log('打开弱光')this.currentState = obj.weakLight}},
}const Light = function() {this.currentState = obj.offLight
}Light.prototype.init = function() {const btn = document.createElement('button')btn.innerHTML = '按钮'document.body.append(btn)const self = thisbtn.addEventListener('click', function() {self.currentState.press.call(self) // 通过 call 完成委托
  })
}const light = new Light()
light.init()

 


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/362893.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Save info in Hidden Field

Hidden fields are used to store data at the page level protected System.Web.UI.HtmlControls.HtmlInputHidden Hidden1; //to assign a value to Hidden field Hidden1.Value"Create hidden fields"; //to retrieve a value string strHidden1.Value; 转载于:ht…

课堂测试

package 测试;import java.util.Scanner;class ScoreInformation {private String stunumber;private String name;private double mathematicsscore;private double englishiscore;private double networkscore;private double databasescore;private double softwarescore;…

Mule ESB,ActiveMQ和DLQ

在本文中,我将展示一个简单的Mule ESB流程,以了解实际中使用的Active MQ 的DLQ功能 。 我假设您有一个正在运行的Apache ActiveMQ实例(如果没有,则可以在此处下载一个版本)。 在此示例中,我使用了Mule ESB…

JS设计模式(2)策略模式

什么是策略模式? 定义:根据不同参数可以命中不同的策略 主要解决:在有多种算法相似的情况下,使用 if...else 所带来的复杂和难以维护。 何时使用:有许多种情况,而区分它们的只是他们直接的行为。 如何解…

C#中使用多线程访问Winform问题解决方案

我们在做winform应用的时候,大部分情况下都会碰到使用多线程控制界面上控件信息的问题。然而我们并不能用传统方法来做这个问题,下面我将详细的介绍。 首先来看传统方法: public partial class Form1 : Form{public Form1(){InitializeCompon…

Choose and Divide UVa 10375

题目大意:给出p,q,r,s,求组合数C(p,q)/C(r,s) 题目思路: 化简得到:原式等价于(p!(r-s)!s!) / (r!(p-q)!q!) 由算数基本定理可知任意一个正整数可被唯一分解为素数幂乘积的形式,将分子分母分解后,进行约分即…

在Java中避免空检查

对于Java开发人员(从初级到专家)最糟糕的噩梦之一是空对象引用检查。 我很确定您已经看过几次这样的代码: public void addAddressToCustomer(Customer customer, Address newAddress){if ( cutomer null || newAddress null)return;if ( …

Linux sudo 详解

简单的说,sudo 是一种权限管理机制,管理员可以授权于一些普通用户去执行一些 root 执行的操作,而不需要知道 root 的密码。严谨些说,sudo 允许一个已授权用户以超级用户或者其它用户的角色运行一个命令。当然,能做什么…

echarts自定义图例legend文字和样式

话不多说,先上效果图。 要完成这个图并不难,主要是下面那个图例比较难,需要定制。 让我们从官方文档找找思路,官方文档关于legend.formatter是这样的:链接在这 难点在于: 1.这里的图例文本包含两个变量&am…

DataGridView常见用法和FAQ汇总

前段时间在项目中用到了WinForm,其中最复杂的控件当属DataGridView了,特别喜欢它那高度的可配置性(提供了大量的属性,方法和事件)、丰富的内置列类型,而且易于扩展,对性能问题也提供了良好的解决方案。不过最初看着它那…

信息的Raid存储方式,更安全的保障,更花钱的保障!

raid0 就是把多个(最少2个)硬盘合并成1个逻辑盘使用,数据读写时对各硬盘同时操作,不同硬盘写入不同数据,速度快。  raid1就是同时对2个硬盘读写(同样的数据)。强调数据的安全性。比较浪费。 …

Java调试器和超时

在代码中存在超时的情况下如何使用调试器。 我的调试器王国! 因此,您一直忙于编写一个项目,一切顺利,直到出现错误为止。 您可以进入开发人员的工具箱,然后拔出调试器。 很棒–您可以设置断点,可以在发生异…

【题解】整理书本

题目描述 小A想把他满屋子的书整理一下。书本分成若干堆。每一堆的书本都有质量w和价值v。小A的任务是将所有书合成一堆。因为小A认为合并i,j两堆的书所需要的力为w[i]-v[i]w[j]-v[j]。合并后的书堆的质量和价值均为合并前两堆书的质量和价值的总和。也就是说&#…

C#正则表达式编程(二):Regex类用法

上一篇讲述了在C#中有关正则表达式的类之间的关系,以及它们的方法,这一篇主要是将Regex这个类的用法的,关于Match及MatchCollection类会在下一篇讲到。对于正则表达式的应用,基本上可以分为验证、提取、分割和替换。仅仅利用Regex…

浏览器记住密码的自动填充Input问题完美解决方案

1、input 前from和input占位隐藏 <form style"width:0;height:0;display:none;"><input type"password" /></form><input type"password" style"width:0;height:0;display:none;" /> 2、input autocomplete&…

Java数字格式

当我看到其他人编写不必要的Java代码并且由于缺乏对已经提供所需功能的JDK类的了解而编写了不必要的Java代码时&#xff0c;我会想到很多次。 这样的一个例子是时间相关的常量的使用硬编码值的写入&#xff0c;如60 &#xff0c; 24 &#xff0c; 1440 &#xff0c;和86400时TI…

数据模型设计

数据&#xff1a;是符号。例如 张三 模型&#xff1a;现实世界事与物特征的抽象与模拟。如飞机模型、空气动力模型。 数据模型&#xff1a;通过对现实世界的事与物主要特征的分析、抽象&#xff0c;为信息系统的实施提供数据存取的数据结构以及相应的约束。 数据模型的要素由操…

优课在线 嵌入式系统(胡威)2018春季测验 参考解析

一、单选题 (共 20.00 分) μCOS-II操作系统属于&#xff08; &#xff09;。 A.一般实时操作系统 B.非嵌入式实时操作系统 C.占先式实时操作系统 D.非占先式实时操作系统 正确答案&#xff1a;C 寄存器R13除了可以做通用寄存器外&#xff0c;还可以做&#xff08; &#xff0…

JBoss Wildfly 8.1上的HawtIO

HawtIO为基于JVM的中间件提供了令人赞叹的视觉效果。 它是应用程序的统一控制台&#xff0c;否则将不得不构建自己的糟糕的Web控制台。 老实说&#xff0c;它们的构建方式各不相同&#xff0c;技术不同&#xff0c;用户体验不同&#xff0c;并且都围绕一种可怕的方式来尝试在QA…

Maven打包时去掉项目版本号

Maven打包时去掉项目版本号 Maven打包后&#xff0c;jar或war文件名里带有版本号信息&#xff0c;如projectname0.0.1-SNAPSHOT.jar等&#xff0c;怎么去掉呢&#xff1f; 解决办法&#xff1a; 打开项目pom.xml文件&#xff0c;在<build> </build>标签内加入如下…