zoukankan      html  css  js  c++  java
  • JS模式--状态模式(状态机)

    • 下面的状态机选择通过Function.prototype.call方法直接把请求委托给某个字面量对象来执行。
     var light = function () {
                this.currstate = FSM.off;
                this.button = null;
            };
            light.prototype.init = function () {
                var button = document.createElement('button');
                self = this;
                button.innerHTML = '已关灯';
                this.button = document.body.appendChild(button);
    
                this.button.onclick = function () {
                    self.currstate.buttonWasPressed.call(self);
                };
            };
    
            var FSM = {
                off: {
                    buttonWasPressed: function () {
                        console.log('关灯');
                        this.button.innerHTML = '下一次按我是开灯';
                        this.currstate = FSM.on;
                    }
                },
                on: {
                    buttonWasPressed: function () {
                        console.log('开灯');
                        this.button.innerHTML = '下一次按我是关灯';
                        this.currstate = FSM.off;
                    }
                }
            };
            var light = new light();
            light.init();
    •  下面利用delegate函数来重写一遍这个状态机
    • 这是面向对象和闭包互换的一个例子。前者将变量保存为对象的属性,后者将变量封闭在闭包形成的环境中
    var delegate = function (client, delegation) {
                return {
                    buttonWasPressed: function () {
                        return delegation.buttonWasPressed.apply(client, arguments);
                    }
                };
            };
    
            var light = function () {
                this.offstate = delegate(this, FSM.off);
                this.onstate = delegate(this, FSM.on);
                this.currstate = FSM.off;
                this.button = null;
            };
            light.prototype.init = function () {
                var button = document.createElement('button');
                self = this;
                button.innerHTML = '已关灯';
                this.button = document.body.appendChild(button);
    
                this.button.onclick = function () {
                    self.currstate.buttonWasPressed.call(self);
                };
            };
    
            var FSM = {
                off: {
                    buttonWasPressed: function () {
                        console.log('关灯');
                        this.button.innerHTML = '下一次按我是开灯';
                        this.currstate = this.onstate;
                    }
                },
                on: {
                    buttonWasPressed: function () {
                        console.log('开灯');
                        this.button.innerHTML = '下一次按我是关灯';
                        this.currstate = this.offstate;
                    }
                }
            };
            var light = new light();
            light.init();

     
    Github上有另外一种方式:

    https://github.com/jakesgordon/javascript-state-machine

  • 相关阅读:
    unity, 调节图片导入尺寸
    photoshop, 钢笔上色
    maxscript, 批量导出物体
    unity, readOnly varible
    通过Maven找java source源码方法
    Nginx技巧:灵活的server_name,Nginx配置一个服务器多个站点 和 一个站点多个二级域名
    设置局域网共享文件不需要用户名密码
    SELECT INTO 和 INSERT INTO SELECT 两种表复制语句
    利用nginx泛域名解析配置二级域名和多域名
    三分钟了解Activity工作流
  • 原文地址:https://www.cnblogs.com/meiyh/p/6515477.html
Copyright © 2011-2022 走看看