javascript的状态模式(二)

原创
2016/05/18 18:04
阅读数 89

状态模式的关键是区分事物内部的状态,事物内部状态的改变往往会带来事物的行为改变。

当电灯开着,此时按下开关,电灯会切换到关闭状态;再按一次开关,电灯又将被打开。同一个开关在不同的状态下,表现出来的行为是不一样的。

// javascript

var delegate = function(client, delegation){

	return {
		buttonWasPressed: function(){
		
			return delegation.buttonWasPressed.apply(client, arguments);
		}
	
	}

}


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 = function(){
	this.button = null;
	this.offState = delegate(this, FSM.off);
	this.onState = delegate(this, FSM.on);

	this.currState = this.offState;
}

Light.prototype.init = function(){
	var self = this;

	var button = document.createElement('button');
	button.innerHTML = '已关灯';
	this.button = document.body.appendChild(button);
	this.button.onclick = function(){
		self.currState.buttonWasPressed();
	}


}

var light = new Light();

light.init();


 

展开阅读全文
打赏
2
3 收藏
分享
加载中
更多评论
打赏
0 评论
3 收藏
2
分享
返回顶部
顶部