分享人:黄苏威
目录
1.背景介绍
2.知识剖析
3.常见问题
4.解决方案
5.编码实战
6.扩展思考
7.参考文献
8.更多讨论
有限状态机,(英语:Finite-state machine, FSM),又称为有限状态自动机,简称状态机, 是一个数学模型。是一个抽象机器,在任何时候都可以处于有限数量的状态之一。响应某些外部输入, FSM可以从一个状态转换到另一个状态; 从一种状态到另一种状态的变化称为过渡。 状态机的行为可以在现代社会中的许多设备中观察到,这些设备根据它们呈现的事件序列执行预定的一系列行为。 例如自动售货机,当存放适当的硬币组合时分配产品,当车辆等待时改变顺序的交通灯等。
有限状态机最初应用在数字系统的涉及,它对数字系统的设计具有十分重要的作用。有限状态机是指输出取决于过去输入部分和当前输入部分的时序逻辑电路。,除了输入部分和输出部分外,有限状态机还含有一组具有“记忆”功能的寄存器,这些寄存器的功能是记忆有限状态机的内部状态,它们常被称为状态寄存器。 在有限状态机中,状态寄存器的的下一个状态不仅与输入信号有关,而且还与该寄存器的当前状态有关,因此有限状态机又可以认为是组合逻辑和寄存器逻辑的一种组合。其中,寄存器逻辑的功能是存储有限状态机的内部状态;而组合逻辑又可以分为次态逻辑和输出逻辑两部分,次态逻辑的功能是确定有限状态机的下一个状态,输出逻辑的功能是确定有限状态机的输出。
在我们前端开发中,我们可以套用有限状态机模型,将业务流程状态化,划分状态和相应的触发事件与动作,利用生命周期事件进行控制与执行。
非常多的游戏都于用到到了有限状态机,比如说像电子宠物,还有之前的旅行蛙 ,炉石传说,还有三国杀 都用到了有限状态机的理论,有限状态机是一种理论,不单单基于js的理论。很多有逻辑的问题都可以用有限状态机完成
有限状态机fsm一般有以下特点: *)可以用状态来描述事物,并且任一时刻,事物总是处于一种状态; *)事物拥有的状态总数是有限的; *)通过触发事物的某些行为,可以导致事物从一种状态过渡到另一种状态; *)同一种行为,可以将事物从多种状态变成同种状态,但是不能从同种状态变成多种状态。
状态机由一组状态和转换组成:
状态 : 固体 、 液体 、 气体。
转换 :融化 、汽化 、 冷凝 、 冻结。
有限状态机长什么样?
需要的函数库:javascript-state-machine插件
var fsm = new StateMachine({
init: 'solid',
transitions: [
{name: 'Melt', from: 'solid', to: 'liquid'},
{name: 'Vaporize', from: 'liquid', to: 'gas'},
{name: 'Condense', from: 'gas', to: 'liquid'},
{name: 'Freeze', from: 'liquid', to: 'solid'}
],
methods: {
onBeforeMelt: function() { /* ... */ },
onBeforeVaporize: function() { /* ... */ },
onBeforeCondense: function() { /* ... */ },
onBeforeFreeze: function() { /* ... */ },
onLeaveSolid: function() { /* ... */ },
onLeaveLiquid: function() { /* ... */ },
onLeaveGas: function() { /* ... */ },
onEnterLiquid: function() { /* ... */ },
onEnterGas: function() { /* ... */ },
onEnterSolid: function() { /* ... */ },
onAfterMelt: function() { /* ... */ },
onAfterVaporise: function() { /* ... */ },
onAfterCondense: function() { /* ... */ }
onAfterFreeze: function() { /* ... */ }
}
});
//方法调用
//1,自执行方法:
fsm.onMelt();
fsm.onVaporize();
fsm.onCondense();
fsm.onFreeze();
//1、触发调用方式:
fsm.Melt();
fsm.Vaporize();
fsm.Condense();
fsm.Freeze();
init选项用来表示fsm对象的初始状态, transitions选项用来描述fsm对象所有状态的变化规则,每一种变化规则对应一种行为。 methods方法为实例的每一种行为都添加了一个方法,调用这个方法就相当于触发对象的某种行为,当对象行为发生时,对象的状态就可以发生变化。如以上例子创建的实例将拥有如下行为方法: fsm.Melt() : 调用该方法,实例状态将从'solid'变为'liquid' fsm.Freeze() : 调用该方法,实例状态将从'liquid'变为'solid' fsm.Vaporize() : 调用该方法,实例状态将从'liquid'变为'gas' fsm.Condense() : 调用该方法,实例状态将从'gas'变为'liquid'
Javascript Finite State Machine允许为每个事件指定两个自定义方法,以Melt事件为例: onbeforeMelt:在warn事件发生之前触发 onafterMelt :在warn事件发生之后触发。 每个状态指定两个自定义方法,以solid状态为例: onleaveSolid :在离开solid状态时触发 onenterLiquid :在进入liquid状态时触发。
为了在发生转换时跟踪或执行操作,有以下五个通用的生命周期事件: // onBeforeTransition - 在任何转换之前触发 // onLeaveState - 离开任何状态被触发 // onTransition - 在任何过渡期间被触发 // onEnterState - 进入任何状态被触发 // onAfterTransition - 任何转换后触发
除了通用事件之外,还可以使用特定的转换和状态来观察转换: // onBefore - 在特定的转换之前触发 // onBefore - 在特定的转换之前触发 // onAfter - 在特定的TRANSITION后触发 // onLeave - 离开特定的状态触发 // onEnter - 进入特定状态触发 // on - 简写 onAfter // on - 简写 onEnter
...辅助方法: // fsm.is(s) - 如果状态s是当前状态,则返回true // fsm.can(t) - 如果t从当前状态发生转换,则返回true // fsm.cannot(t) - 如果t从当前状态不能发生转换,则返回true // fsm.transitions() - 返回当前状态允许的转换列表 // fsm.allTransitions() - 返回所有可能的转换的列表 // fsm.allStates() - 返回所有可能状态的列表 //Cancelling a Transition 取消转换
可以通过false在以下任何生命周期事件中显式返回来取消转换:
在方法中return false可以取消当前触发的行为: // onBeforeTransition // onBefore // onLeaveState // onLeave // onTransition // 所有随后的生命周期事件将被取消,状态将保持不变。
如何使用有限状态机实现杀人游戏?
将杀人游戏逻辑模型化,划分状态和相应的触发事件与动作,利用生命周期事件进行控制与执行。
如何保存玩家状态?
通过webStorage,保存玩家状态,在需要的时候再取出。 localStorage.setItem("key","value");//以“key”为名称存储一个值“value” localStorage.getItem("key");//获取名称为“key”的值参考一:javascript-state-machine官方文档
参考二:初探Promise
参考三:百度百科,维基百科
感谢大家观看
BY : 黄苏威