js设计模式 -- 状态机

/*****************************抽象类***************************/
var State = function() {};
State.prototype.pressButton = function() {
    throw new Error('pressButton方法必须重写');
};
/*****************************状态类***************************/
//关灯状态
var OffState = function(light) {
    this.light = light;
};
OffState.prototype = new State(); //继承父类
//覆盖父类方法
OffState.prototype.pressButton = function() {
    console.log('弱光');
    this.light.setState(this.light.weak);
};
// 弱光状态
var WeakState = function(light) {
    this.light = light;
};
WeakState.prototype = new State(); //继承父类
// 覆盖父类方法
WeakState.prototype.pressButton = function() {
    console.log('强光');
    this.light.setState(this.light.strong);
};
// 强光状态
var StrongState = function(light) {
    this.light = light;
};
StrongState.prototype = new State(); //继承父类
// 覆盖父类方法
StrongState.prototype.pressButton = function() {
    console.log('关灯');
    this.light.setState(this.light.off);
};

//******************灯类********************//
var Light = function() {
    this.off = new OffState(this);
    this.weak = new WeakState(this);
    this.strong = new StrongState(this);
    this.button = null;
};
Light.prototype.init = function() {
    var button = document.createElement('button');
    var _self = this;
    this.button = document.body.appendChild(button);
    this.button.innerHTML = '三种状态开关';
    this.currentState = this.off; //设置当前状态为关闭状态
    this.button.onclick = function() {
        _self.currentState.pressButton();
    };
};
Light.prototype.setState = function(newState) {
    this.currentState = newState;
};

转载于:https://www.cnblogs.com/smss/p/7357873.html