发表于: 2017-03-30 23:38:00

2 1287


  • 今天完成的事情:学习有限状态机,学习localstorage、sessionstorage,理清任务4的页面逻辑,做完法官页面

  • 明天计划的事情:做完杀手页面

  • 遇到的问题:

  • css写起来有点手生。对this的用法不太懂。

  • 收获:

  • 有限状态机: 一个事物状态转换的模型。转台转换由事件/条件触发。

  • 用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;
           }
       }

    };

    hover时间触发menu.transition()方法,匹配当前状态,然后改变状态。

但是有个问题,transition中的this是指向self的,而self指向menu。所以transition的this指向menu,但是如果

发生事件的不是self而是其他,例如一个按钮节点。那么transition中的this就会指向发生事件的按钮节点。

this就不能指向menu了


返回列表 返回列表
评论

    分享到