发表于: 2017-04-26 00:28:08
2 1078
今天完成的事情:
认识了js有限状态机, 任务3的一小部分;
有限状态机的js库:https://github.com/jakesgordon/javascript-state-machine;
该库提供了一个全局全局对象stateMachine,使用create方法生成一个有限状态机实例;
var fsm = stateMachine.create();
生成的实例需要提供一个参数对象,用来描述实例的性质,
如:
var fsm = starteMachine.create({
initial: "green"//初始化值,
events: [//触发状态的各种事件
{name: "warn", from: "green", to: "yellow"},
{name: "panic", from: "yellow", to: "red"},
{name: "calm", from: "red", to: "yellow"},
{name: "clear", from: "yellow, to : "green"} //触发事件后,结果又from状态转变到to状态;
]
})
生成实例后查询当前状态的方法:
* fsm.current :返回当前状态。
* fsm.is(s) :返回一个布尔值,表示状态s是否为当前状态。
* fsm.can(e) :返回一个布尔值,表示事件e是否能在当前状态触发。
* fsm.cannot(e) :返回一个布尔值,表示事件e是否不能在当前状态触发
为每个事件指定了2个回调函数:
* onbeforewarn:在warn事件发生之前触发。
* onafterwarn(可简写成onwarn) :在warn事件发生之后触发。
也为每个状态指定2个回调函数:
* onleavegreen :在离开green状态时触发。
* onentergreen(可简写成ongreen) :在进入green状态时触发。
同时也为所有事件和状态提供了通用的回调函数:
* onbeforeevent :任一事件发生之前触发。
* onleavestate :离开任一状态时触发。
* onenterstate :进入任一状态时触发。
* onafterevent :任一事件结束后触发。
如果事件的回调函数里面有异步操作(比如与服务器进行Ajax通信),这时我们可能希望等到异步操作结束,再发生状态改变。这就要用到transition方法
fsm.onleavegreen = function(){
light.fadeOut('slow', function() {
fsm.transition();
});
return StateMachine.ASYNC;
};
上面代码的回调函数里面,有一个异步操作(light.fadeOut)。如果不希望状态立即改变,就要让回调函数返回StateMachine.ASYNC,表示状态暂时不改变;等到异步操作结束,再调用transition方法,使得状态发生改变
事件发生生按顺进行的,有green变yellow-->yellow--->red---yellow--->green,;
有限状态机模型的满足要求:
1)可以用状态来描述事物,并且任一时刻,事物总是处于一种状态
这个例子中创建的交通灯实例,要么处于yellow状态,要么处于red状态,要么处于green状态,所以它是满足第1点的。
2)事物拥有的状态总数是有限的
这个实例最多只有三个状态。
3)通过触发事物的某些行为,可以导致事物从一种状态过渡到另一种状态
fsm.warn,fsm.panic,fsm.cal,fsm.clear这几个行为方法都能改变实例的状态。
4)事物状态变化是有规则的,A状态可以变换到B,B可以变换到C,A却不一定能变换到C
明天计划的事情:
思考如何实现任务3人,从法官台本,杀人页面,投票页面,之间数据状态的变化,
遇到的问题:
虽然学了有限状态机,但是不知道如何运用它 ,一头雾水。
试着创建有限状态机对象:
杀手杀人---》亡灵发言---》玩家发言---》开始投票, 不知写回调函数,
无法做到页面跳转后,在返回该页面时,页面被修改的内容不会被刷新,
收获:
没有什么实际的收获,完全是云里雾里,
评论