js状态模式

news2025/1/9 11:57:24

允许一个对象在其内部状态改变时改变它的行为。
状态模式将对象的状态封装成独立的类,并使它们可以互相转换
在这里插入图片描述

 // 定义状态接口

class State {

  constructor() {

    if (this.constructor === State) {

      throw new Error('不能实例化抽象类');

    }

  }

  // 定义状态方法

  handle(context) {

    throw new Error('必须实现 handle 方法');

  }

}

  

// 具体状态类 A

class ConcreteStateA extends State {

  constructor() {

    super();

  }

  // 实现状态方法

  handle(context) {

    console.log('执行具体状态 A 的方法');

    context.setState(new ConcreteStateB());

  }

}

  

// 具体状态类 B

class ConcreteStateB extends State {

  constructor() {

    super();

  }

  // 实现状态方法

  handle(context) {

    console.log('执行具体状态 B 的方法');

    context.setState(new ConcreteStateA());

  }

}

  

// 上下文类

class Context {

  constructor() {

    this.state = new ConcreteStateA();

  }

  // 设置状态方法

  setState(state) {

    this.state = state;

  }

  // 执行状态方法

  request() {

    this.state.handle(this);

  }

}

  

// 使用状态模式

let context = new Context();

context.request();

context.request();

context.request();
class CoffeeMaker {

    constructor() {

      /**

      这里略去咖啡机中与咖啡状态切换无关的一些初始化逻辑

    **/

      // 初始化状态,没有切换任何咖啡模式

      this.state = 'init';

      // 初始化牛奶的存储量

      this.leftMilk = '500ml';

    }

    //将状态作为属性放进去

    stateToProcessor = {

      that: this,

      american() {

        // 尝试在行为函数里拿到咖啡机实例的信息并输出

        console.log('咖啡机现在的牛奶存储量是:', this.that.leftMilk)

        console.log('我只吐黑咖啡');

      },

      latte() {

        this.american()

        console.log('加点奶');

      },

      vanillaLatte() {

        this.latte();

        console.log('再加香草糖浆');

      },

      mocha() {

        this.latte();

        console.log('再加巧克力');

      }

    }

    // 关注咖啡机状态切换函数

    changeState(state) {

      this.state = state;

      if (!this.stateToProcessor[state]) {

        return;

      }

      this.stateToProcessor[state]();

    }

  }

  const mk = new CoffeeMaker();

  mk.changeState('latte');

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

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

相关文章

平面坐标转大地坐标(arcgisPro中进行)

1、将需要转换的红线导入arcgisPro中,如下: 2、在地图菜单栏中,选择坐标转换工具,如下: 3、打开坐标转换工具 4、开启捕捉 5、 设置大地坐标显示格式 6、如下: 7、显示如图: 8、再依次添加几个待…

(长期更新)《零基础入门 ArcGIS(ArcScene) 》实验七----城市三维建模与分析(超超超详细!!!)

城市三维建模与分析 三维城市模型已经成为一种非常普遍的地理空间数据资源,成为城市的必需品,对城市能化管理至关重要。语义信息丰富的三维城市模型可以有效实现不同领域数据与IS相信息的高层次集成及互操作,从而在城市规划、环境模拟、应急响应和辅助决策等众多领域公挥作用、…

SpringBootWeb 登录认证(day12)

登录功能 基本信息 请求参数 参数格式:application/json 请求数据样例: 响应数据 参数格式:application/json 响应数据样例: Slf4j RestController public class LoginController {Autowiredpriva…

夯实前端基础之HTML篇

知识点概览 HTML部分 1. DOM和BOM有什么区别? DOM(Document Object Model) 当网页被加载时,浏览器会创建页面的对象文档模型,HTML DOM 模型被结构化为对象树 用途: 主要用于网页内容的动态修改和交互&…

UI自动化测试保姆级教程--pytest详解(精简易懂)

欢迎来到啊妮莫的学习小屋 别让过去的悲伤,毁掉当下的快乐一《借东西的小人阿莉埃蒂》 简介 pytest是一个用于Python的测试框架, 支持简单的单元测试和复杂的功能测试. 和Python自带的UnitTest框架类似, 但是相比于UnitTest更加简洁, 效率更高. 特点 非常容易上手…

有序数据中插入不确定数据保证数据插入的位置顺序正确排序

解决有序数据中插入不确定数据保证数据插入的位置顺序正确排序 前言 java 数据库中存储自增id 有序的数据, 前端页面基于 id 5和 6 之间新增一条数据,在 id 6 和 7之间新增 2条,或者更复杂的场景,后台接口如何保存数据使得页面数…

基于 Apache Commons Pool 实现的 gRPC 连接池管理类 GrpcChannelPool 性能分析与优化

基于 Apache Commons Pool 实现的 gRPC 连接池管理类 GrpcChannelPool 性能分析与优化 1. 输出关键信息的代码示例 日志记录方法 使用以下代码记录连接池的关键信息,帮助分析连接池的状态和性能瓶颈: import org.apache.commons.pool2.impl.GenericO…

不同方式获取音频时长 - python 实现

DataBall 助力快速掌握数据集的信息和使用方式,会员享有 百种数据集,持续增加中。 需要更多数据资源和技术解决方案,知识星球: “DataBall - X 数据球(free)” -------------------------------------------------------------…

在 C# 中显示动画 GIF 并在运行时更改它们

您可以通过将按钮、图片框、标签或其他控件的Image属性设置为 GIF 文件 来显示动画 GIF 。(如果您在窗体的BackgroundImage属性中显示一个,则不会获得动画。) 有几种方法可以在运行时更改 GIF。 首先,您可以将 GIF 添加为资源。…

Element-plus、Element-ui之Tree 树形控件回显Bug问题。

需求&#xff1a;提交时&#xff0c;需要把选中状态和半选中状态 的数据id提交。如图所示&#xff1a; 数据回显时&#xff0c;会出现代码如下&#xff1a; <template><el-tree ref"treeRef" :data"data" show-checkbox node-key"id" …

【江协STM32】9-1/2/3 USART串口协议、USART外设、串口发送串口发送+接收

1. 通信接口 通信的目的&#xff1a;将一个设备的数据传送到另一个设备&#xff0c;扩展硬件系统通信协议&#xff1a;制定通信的规则&#xff0c;通信双方按照协议规则进行数据收发全双工&#xff1a;指通信双方能够同时进行双向通信。发送线路和接收线路互不影响&#xff0c…

小程序租赁系统开发的优势与应用前景分析

内容概要 小程序租赁系统是一种新兴的数字化解决方案&#xff0c;旨在为用户提供更加便捷与高效的租赁服务。它通常包括一系列功能&#xff0c;如在线浏览、即时预定、支付功能以及用户反馈机制。这些系统在使用上极为友好&#xff0c;让用户能够轻松选择所需的商品或服务&…

25/1/8 算法笔记<强化学习> GYM环境

前几天花了好多时间在装各个仿真环境上&#xff0c;有V-rep,Pybullet,unity的Ml-agent,很多一大堆&#xff0c;好多好多问题差点逼疯我&#xff0c;可能就pybullet能玩一点&#xff0c;到之后学了机器人我再来玩它&#xff0c;最后的最后&#xff0c;我发现还得是我的gym&#…

学习随记:word2vec中归一化处理的作用

答案来自ai&#xff0c;直接复用为参考&#xff1a; 向量归一化的好处 将向量进行归一化&#xff0c;使其模长为 1&#xff08;即投射到单位圆/单位球上&#xff09;&#xff0c;在许多情况下具有实际意义和计算优势。以下是归一化的主要好处和原因&#xff1a; 1. 提高数值稳…

【C++】B2108 图像模糊处理

博客主页&#xff1a; [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: C 文章目录 &#x1f4af;前言&#x1f4af;题目描述题目内容输入格式输出格式示例输入&#xff1a;输出&#xff1a; &#x1f4af;题目分析问题拆解 &#x1f4af;我的做法代码实现代码分析 &#x1f4af;老师的做法…

selenium+pyqt5自动化工具总结

说明&#xff1a;本工具是&#xff0c;操作外部google浏览器、selenium是无法操作qt界面中嵌套的浏览器的&#xff0c; 工具在后面 1. 代码结构 pycharm打开的文件下&#xff0c;再写一个子文件&#xff0c;文件导入的时候把子文件名带上 这样就可以在 外层使用命令 pyinst…

经典多模态模型CLIP - 直观且详尽的解释

对比语言-图像预训练&#xff08;CLIP&#xff09;&#xff0c;这是一种创新的多模态建模策略&#xff0c;能够创建视觉和语言的联合表示。CLIP 的效果非常出色&#xff0c;可以用于构建高度特定且性能卓越的分类器&#xff0c;而无需任何训练数据。本文将深入探讨其理论基础&a…

新时期下k8s 网络插件calico 安装

1、k8s master节点初始化完毕以后一直处于notreadey状态&#xff0c;一直怀疑是安装有问题或者是初始化有问题&#xff08;当然&#xff0c;如果真有问题要先解决这些问题&#xff09;&#xff0c;经过不断探索才发现是网络插件没有安装导致的&#xff0c;根据建议安装calico插…

【图像加密解密】Logistic混沌映射的彩色图像加密算法复现(含相关性检验)【Matlab完整源码 1期】

1、说明 本文给出详细完整代码、完整的实验报告和PPT。 环境&#xff1a;MATLAB2019a 复现文献&#xff1a;[1]黄硕.基于改进的Logistic混沌映射彩色图像加密算法[J].河南工程学院学报(自然科学版),2015,27(02):63-67. 主要目的是为了快速了解何为混沌序列、混沌序列产生、…

[AUTOSAR 基础入门] - RTE虚拟总线详解

文章目录 一、什么是RTE二、RTE的作用三、RTE对Runnables的运行支撑四、RTE与通信4.1. RTE – ECU之间通信4.2. RTE - Sender/Receiver 通信4.2.1 不使用队列&#xff08;直接访问&#xff09;4.2.2 不使用队列&#xff08;缓存访问&#xff09;4.2.3 使用队列 4.3 RTE - Clien…