有限状态机是什么
1.背景介绍
什么是有限状态机?
有限状态机(Finite-state machine)是一个非常有用的模型,可以模拟世界上大部分事物。它 是一个数学模型。是一个抽象机器,在任何时候都可以处于有限数量的状态之一。响应某些外部输入, FSM可以从一个状态转换到另一个状态; 从一种状态到另一种状态的变化称为过渡。 状态机的行为可以在现代社会中的许多设备中观察到,这些设备根据它们呈现的事件序列执行预定的一系列行为。 例如自动售货机,当存放适当的硬币组合时分配产品,当车辆等待时改变顺序的交通灯等。
在我们前端开发中,我们可以套用有限状态机模型,将业务流程状态化,划分状态和相应的触发事件与动作,利用生命周期事件进行控制与执行
2.知识剖析
有限状态机一般都有以下特点:
(1)可以用状态来描述事物,并且任一时刻,事物总是处于一种状态;
(2)事物拥有的状态总数是有限的;
(3)通过触发事物的某些行为,可以导致事物从一种状态过渡到另一种状态;
(4)事物状态变化是有规则的,A状态可以变换到B,B可以变换到C,A却不一定能变换到C;
(5)同一种行为,可以将事物从多种状态变成同种状态,但是不能从同种状态变成多种状态。
状态机由一组状态和转换组成:
状态 : 固体 、 液体 、 气体。
转换 :融化 、汽化 、 冷凝 、 冻结。
以上的形式可以状态机来写一下
首先需要引入有限状态机库 状态机库
以上的形式可以状态机来写一下
首先需要引入有限状态机库 状态机库
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' }
],
methods: {
onMelt: function(){ console.log('I melted') },
onFreeze: function(){ console.log('I froze') },
onVaporize: function(){ console.log('I vaporized') },
onCondense: function(){ console.log('I condensed') }
}
});
//方法调用 //1,自执行方法: fsm.onMelt();
fsm.onFreeze();
fsm.onVaporize();
fsm.onCondense();
//1、触发调用方式: fsm.Melt();
fsm.Freeze();
fsm.Vaporize();
fsm.Condense();
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:在Melt事件发生之前触发
onafterMelt :在Melt事件发生之后触发。
每个状态指定两个自定义方法,以solid状态为例:
onleaveSolid :在离开solid状态时触发
onenterLiquid :在进入liquid状态时触发。
辅助方法:
// fsm.is(s) - 如果状态s是当前状态,则返回true
// fsm.can(t) - 如果t从当前状态发生转换,则返回true
// fsm.cannot(t) - 如果t从当前状态不能发生转换,则返回true
// fsm.transitions() - 返回当前状态允许的转换列表
// fsm.allTransitions() - 返回所有可能的转换的列表
// fsm.allStates() - 返回所有可能状态的列表
//Cancelling a Transition 取消转换
3.常见问题
有限状态机有哪些应用场景?
4.解决方案
满足3点即可用:所需状态确定,有事件触发转变状态,总状态有限且转变有规律。
页面可用有限状态机的元素较多且有规律时可用:例如:开关按钮,下拉菜单,
还有任务中杀人游戏的玩家死活状态、白天黑夜状态等,这里实现的是流程控制
5.编码实战
6.扩展思考
有限状态机有哪些优点?
有限状态机的写法,逻辑清晰,表达力强,有利于封装事件。一个对象的状态越多、发生的事件越多,就越适合采用有限状态机的写法。 另外,JavaScript语言是一种异步操作特别多的语言,常用的解决方法是指定回调函数, 但这样会造成代码结构混乱、难以测试和除错等问题。有限状态机提供了更好的办法: 把异步操作与对象的状态改变挂钩,当异步操作结束的时候,发生相应的状态改变,由此再触发其他操作。 这要比回调函数、事件监听、发布/订阅等解决方案,在逻辑上更合理,更易于降低代码的复杂度。
7.参考文献
参考一:有限状态机库
参考二:阮一峰的有限状态机
8.更多讨论
控制天数变化,该如何实现
创建一个控制天数的参数
var day=new StateMachine({
init:'1',
transitions:[{
name:'add',
from:'1',
to:'1++'
},
{
name:'over',
from:'1++',
to:'1'
}
],
methods:{
onAdd:function(){
}
}
})