JavaScript之状态模式实例

左手的ㄟ右手 2022-05-27 02:56 76阅读 0赞

一、状态模式定义：允许一个对象在其内部状态改变时改变它的行为，对象看起来似乎修改了它的类。

二、状态模式的关键是区分事物内部的状态，事物内部状态的改变往往会带来事物的行为改变。

三、如下有一个比较好的实例，代码如下：

var delegate = function(client, delegation){
         return{
             buttonWasPressed: function(){ //将客户的操作委托给delegation对象
                  return delegation.buttonWasPressed.apply(client, arguments );
             }
         }
    };
    
    var FSM = {
        off: {
            buttonWasPressed: function(){
                console.log('关灯');
                this.button.innerHTML = '下一次按我是开灯';
                 this.currState = this.onState;
            }
        },
        on:{
            buttonWasPressed: function(){
               console.log('开灯');
               this.button.innerHTML = '下一次按我是关灯';
               this.currState = this.offState;
            }
        }
    };
    
    var Light = function(){
        this.offState = delegate( this, FSM.off );
        this.onState = delegate( this, FSM.on );
        this.currState = this.offState;  //设置初始状态为关闭状态
        this.button = null;
    };
    
    Light.prototype.init = function(){
       var button = document.createElement( 'button' ),
           self = this;
       button.innerHTML = '已关灯';
       this.button = document.body.appendChild( button );
        this.button.onclick = function(){
            self.currState.buttonWasPressed();
        }
    };
    
    var light = new Light();
    light.init();

四、状态模式的优缺点：

1、优点：

A、定义了状态与行为之间的关系，并将它们封装在一个类里。通过增加新的状态类，很容易增加新的状态和转换。

B、避免 Context 无限膨胀，状态切换的逻辑被分布在状态类中，也去掉了 Context 中原本过多的条件分支。

C、用对象代替字符串来记录当前状态，使得状态的切换更加一目了然。

D、Context 中的请求动作和状态类中封装的行为可以非常容易地独立变化而互不影响。

2、缺点：

A、在系统中定义许多状态类，而且系统中会因此而增加不少对象。

B、由于逻辑分散在状态类中，虽然避开了不受欢迎的条件分支语句，但也造成了逻辑分散的问题，我们无法在一个地方就看出整个状态机的逻辑。

发表评论取消回复

表情：

评论列表（有 0 条评论，76人围观）

还没有评论，来说两句吧...

相关阅读

相关状态模式实例请假流程

工作流中的请假流程某人提出请假申请，先由项目经理审批，如果项目经理不同意，审批就直接结束如项目经理同意，再看是否超过3天，如果三天以内，审批直接结束否则，交给

朱雀/ 2023年10月06日 08:17/ 0 赞/ 2 阅读

相关 PHP设计模式之状态模式（State）代码实例大全（29）

目的状态模式可以基于一个对象的同种事务而封装出不同的行为。它提供一种简洁的方式使得对象在运行时可以改变自身行为，而不必借助单一庞大的条件判断语句。 UML图 !

布满荆棘的人生/ 2022年12月08日 13:00/ 0 赞/ 191 阅读

相关设计模式之状态模式

一.什么是状态模式? 状态模式:当一个对象的内在状态改变时允许改变其行为,这个对象看起来像是改变了这个类. 二.什么时候使用状态模式? 状态模式主要解决的是当控制

Dear 丶/ 2022年12月04日 07:59/ 0 赞/ 122 阅读

相关设计模式之状态模式

在软件开发过程中，应用程序中的部分对象可能会根据不同的情况作出不同的行为，我们把这种对象称为有状态的对象，而把影响对象行为的一个或多个动态变化的属性称为状态。状态模式：对有

系统管理员/ 2022年09月11日 13:18/ 0 赞/ 130 阅读

相关设计模式之状态模式

定义：又称状态对象模式（Pattern of Objects for States），状态模式是对象的行为模式。状态模式允许一个对象在其内部状态改变的时候改变其行为。这个对象看

r囧r小猫/ 2022年07月26日 05:20/ 0 赞/ 147 阅读

相关 JavaScript之适配器模式实例

一、适配器模式：是为了解决软件实体间的接口不兼容的问题。适配器的别名是包装器（wrapper）；二、首先，假设我们已经有如下代码： var googleMap =

àì夳堔傛蜴生んèń/ 2022年05月27日 02:58/ 0 赞/ 87 阅读

相关 JavaScript之状态模式实例

一、状态模式定义：允许一个对象在其内部状态改变时改变它的行为，对象看起来似乎修改了它的类。二、状态模式的关键是区分事物内部的状态，事物内部状态的改变往往会带来事物的行为改变

左手的ㄟ右手/ 2022年05月27日 02:56/ 0 赞/ 77 阅读

相关 JavaScript之职责链模式实例

一、职责链的定义：使多个对象都有机会处理请求，从而避免请求的发送者和接收者之间的耦合关系，将这些对象连成一条链，并沿着这条链传递该请求，直到有一个对象处理它为止。二、实例场

本是古典何须时尚/ 2022年05月27日 01:17/ 0 赞/ 120 阅读

相关设计模式之状态模式

. 模式定义在很多情况下，一个对象的行为取决于它的一个或多个变化的属性，这些属性我们称之为状态，这个对象称之为状态对象。对于状态对象而已，它的行为依赖于它的状态，

蔚落/ 2022年03月27日 11:24/ 0 赞/ 194 阅读

相关 JavaScript设计模式(十六)【状态模式】

/ 状态模式：当一个对象的内部状态发生改变时，会导致其行为的改变，这看起来像是改变了对象。 / // 状态对象 var ResultStat

落日映苍穹つ/ 2021年07月04日 11:56/ 0 赞/ 372 阅读