Ejemplo de modo de estado de JavaScript

1. Definición del modo de estado: permite que un objeto cambie su comportamiento cuando cambia su estado interno El objeto parece modificar su clase.

2. La clave del modelo de estado es distinguir el estado interno de las cosas Los cambios en el estado interno de las cosas a menudo conducen a cambios en el comportamiento de las cosas.

Tres, hay un buen ejemplo de la siguiente manera, el código es el siguiente:

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();

Cuarto, las ventajas y desventajas del modo estatal:

1. Ventajas:

   A. Definir la relación entre estado y comportamiento, y encapsularlos en una clase. Al agregar nuevas clases estatales, es fácil agregar nuevos estados y transiciones.

   B. Para evitar la expansión infinita del contexto, la lógica del cambio de estado se distribuye en clases de estado y también se eliminan las ramas condicionales excesivas originales en el contexto.

   C. Utilice objetos en lugar de cadenas para registrar el estado actual, haciendo que el cambio de estado sea más claro.

   D. La acción de solicitud en el contexto y el comportamiento encapsulado en la clase de estado se pueden cambiar fácilmente de forma independiente sin que se afecten entre sí.

2. Desventajas:

      R. Muchas clases de estado están definidas en el sistema y, como resultado, se agregarán muchos objetos al sistema.

      B. Dado que la lógica está dispersa en la clase estatal, aunque se evitan declaraciones de rama condicionales impopulares, también causa el problema de la fragmentación lógica No podemos ver la lógica de toda la máquina estatal en un solo lugar.