javascript-state-machine文档翻译02:状态和转换动作

本文探讨了状态机的设计原理,包括多种状态和转换动作的定义,如固液气转换、通用通配符和条件转换的应用。通过实例展示了如何创建一个具有复杂生命周期管理的智能状态机,并介绍了如何使用通配符和函数实现灵活的GOTO操作。
摘要由CSDN通过智能技术生成

image.png

状态机是由一组状态(states), 如:

  • solid
  • liquid
  • gas

和一套转换动作(transitions)组成的, 如:

  • melt
  • freeze
  • vaporize
  • condense
  var fsm = new StateMachine({
    init: 'solid',
    transitions: [
      { name: 'melt',     from: 'solid',  to: 'liquid' },
      { name: 'freeze',   from: 'liquid', to: 'solid'  },
      { name: 'vaporize', from: 'liquid', to: 'gas'    },
      { name: 'condense', from: 'gas',    to: 'liquid' }
    ]
  });

  fsm.state;             // 'solid'
  fsm.melt();
  fsm.state;             // 'liquid'
  fsm.vaporize();
  fsm.state;             // 'gas'

一个转换动作处理多个状态

image.png

如果多个状态转换都要用相同的转换动作,那么就把name值设置为相同的动作命名。

  { name: 'step',  from: 'A', to: 'B' },
  { name: 'step',  from: 'B', to: 'C' },
  { name: 'step',  from: 'C', to: 'D' }

如果多个from状态都要转换到相同的to状态, 如:

  { name: 'reset', from: 'B', to: 'A' },
  { name: 'reset', from: 'C', to: 'A' },
  { name: 'reset', from: 'D', to: 'A' }

可以将from状态组成数组来对其进行缩写:

  { name: 'reset', from: [ 'B', 'C', 'D' ], to: 'A' }

将以上用法合并成一个简单示例如下:

  var fsm = new StateMachine({
    init: 'A',
    transitions: [
      { name: 'step',  from: 'A',               to: 'B' },
      { name: 'step',  from: 'B',               to: 'C' },
      { name: 'step',  from: 'C',               to: 'D' },
      { name: 'reset', from: [ 'B', 'C', 'D' ], to: 'A' }
    ]
  })

此示例将创建一个具有两个转换方法的对象:

  • fsm.step()
  • fsm.reset()

reset方法总是将状态转换到A状态, 而step转换到的目标状态为当前状态对应的状态结束。

通配符转换

如何适用于从任何状态转换到目标状态?可以在from状态中使用通配符*

  var fsm = new StateMachine({
    transitions: [
      // ...
      { name: 'reset', from: '*', to: 'A' }
    ]
  });

条件转换

通过提供一个函数作为to属性,可以实现在运行时选择目标状态:

  var fsm = new StateMachine({
    init: 'A',
    transitions: [
      { name: 'step', from: '*', to: function(n) { return increaseCharacter(this.state, n || 1) } }
    ]
  });

  fsm.state;      // A
  fsm.step();
  fsm.state;      // B
  fsm.step(5);
  fsm.state;      // G

  // helper method to perform (c = c + n) on the 1st character in str
  function increaseCharacter(str, n) {
    return String.fromCharCode(str.charCodeAt(0) + n);
  }

allStates方法只有在运行到这个条件状态时才包含它们:

  fsm.state;        // A
  fsm.allStates();  // [ 'A' ]
  fsm.step();
  fsm.state;        // B
  fsm.allStates();  // [ 'A', 'B' ]
  fsm.step(5);
  fsm.state;        // G
  fsm.allStates();  // [ 'A', 'B', 'G' ]

GOTO - 任意切换状态

你可以使用条件转换,组合from使用通配符,来实现任意goto行为:

  var fsm = new StateMachine({
    init: 'A'
    transitions: [
      { name: 'step', from: 'A', to: 'B'                      },
      { name: 'step', from: 'B', to: 'C'                      },
      { name: 'step', from: 'C', to: 'D'                      },
      { name: 'goto', from: '*', to: function(s) { return s } }
    ]
  })

  fsm.state;     // 'A'
  fsm.goto('D');
  fsm.state;     // 'D'

goto仍适用于在一套完整的生命周期事件中使用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值