发表于: 2019-12-12 14:12:11
1 1087
今日完成:
完成了杀人游戏,功能上没有测出什么问题,样式可能会有些出入。
js代码就不贴了,写的太乱了(真的是不堪入目
后面任务中会抽时间回过头来继续修改,提升空间还很大。
遇到的问题:
关于有限状态机的使用。
搜查相关资料,下面这段代码出现频率很高:
var menu = {
// 当前状态
currentState: 'hide',
// 绑定事件
initialize: function() {
var self = this;
self.on("hover", self.transition);
},
// 状态转换
transition: function(event){
switch(this.currentState) {
case "hide":
this.currentState = 'show';
doSomething();
break;
case "show":
this.currentState = 'hide';
doSomething();
break;
default:
console.log('Invalid State!');
break;
}
}
};
绑定事件initialize方法这块没看懂。
对象自身绑定hover事件?
那我应该怎么使用呢?比如说我想绑定$('#box')元素的点击事件。
$('#box').on('click',function () {
menu.transition();
});
在对象外部绑定倒是可以,但initialize方法就没啥用了。
在杀人游戏中类似菜单折叠功能也没用它这个有限状态机,因为需求状态比较简单,所以If/else会更简单些:
$('.day').on('click',function () {
if ($(this).next().css('display')==='none'){
$(this).next().css('display','block');
}else {
$(this).next().css('display','none');
}
});
明日计划:
完成任务五。
评论