您的位置：首页 > 其它
设计模式知识连载（28）---状态模式:

2017-12-25 22:41 363 查看
<body>

<h3>设计模式知识连载（28）---状态模式:</h3>
<p>
当一个对象的内部状态发生改变时，会导致其行为的改变，这看起来像是改变了对象
</p>

<hr>

<script type="text/javascript">

/**
*   案例一：图片展示，方式一：初始
*/
// 展示结果：
function showResult(result) {
if(result == 0) {
console.log('result=0')
}else if(result == 1) {
console.log('result=1')
}else if(result == 2) {
console.log('result=2')
}else if(result == 3){
console.log('result=3')
}
}

/**
*   案例一：图片展示，方式二：状态模式
*/
//投票结果状态对象
var ResultState = function() {
// 判断结果保存在内部状态中
var States = {
// 每种状态作为一种独立方法保存
state0 : function() {
console.log('state0') ;
},
state1 : function() {
console.log('state1') ;
},
state2 : function() {
console.log('state2') ;
},
state3 : function() {
console.log('state3') ;
}
}
// 获取某一种状态并执行其对应的方法
function show(result) {
States['state' + result] && States['state' + result]() ;
}
// 返回调用状态方法接口
return {
show : show
}
} ;

// 测试实例：
// var result_state = new ResultState() ;
// result_state.show(3) ;

/**
*   案例二：超级玛丽，方式一：初始状态
*/
//单动作条件判断，每增加一个动作就需要添加一个判断
var lastAction_single = '' ;
function changeMarry_single(action) {
if(action == 'jump') {
console.log('进行了跳跃动作') ;
}else if(action == 'move') {
console.log('进行了移动动作') ;
}else{
console.log('进行了默认动作') ;
}
lastAction_single = action ;
}

// console.log('单动作条件判断------------') ;
// changeMarry_single('jump') ;

// 复合动作对条件判断的开销是翻倍的
var lastAction1_complex = '' ;
var lastAction2_complex = '' ;
function changeMarry_complex(action1, action2) {
if(action1 == 'shoot' && action2 == '') {
console.log('进行了射击动作') ;
}
else if(action1 == 'jump' && action2 == '') {
console.log('进行了跳跃动作');
}
else if(action1 == 'move' && action2 == 'shoot') {
console.log('进行了移动射击动作') ;
}else if(action1 == 'jump' && action2 == 'shoot') {
console.log('进行了跳跃射击动作') ;
}else{
console.log('进行了默认动作') ;
}

// 保留上一个动作
lastAction1_complex = action1 || '' ;
lastAction2_complex = action2 || '' ;
}
// console.log('复合动作判断------------') ;
// changeMarry_complex('jump', 'shoot') ;

/**
*   案例二：超级玛丽，方式一：状态优化
*/
// 创建超级玛丽状态类
var MarryState = function() {
// 内部状态私有量
var _currentState = {} ;

// 动作与状态方法映射
var states = {
jump : function () {
console.log('jump...【跳跃】') ;
},
move : function() {
console.log('move...【移动】') ;
},
shoot : function() {
console.log('shoot...【射击】') ;
},
squat : function() {
console.log('squat...【蹲下】') ;
}
} ;

// 动作控制类
var Action = {
// 改变状态方法
changeState : function() {
// 组合动作通过传递多个参数实现
var arg = arguments ;

// 重置内部状态
_currentState = {} ;

// 如果有动作则添加动作
if(arg.length) {
// 遍历动作
for(var i = 0; i < arg.length; i++) {
_currentState[arg[i]] = true ;
}
}
// 返回动作控制类
return this ;
},
// 执行动作
goes : function() {
console.log('触发一次动作') ;
// 遍历内部状态保存的动作
for(var i in _currentState) {
// 如果该动作存在则执行
states[i] && states[i]() ;
}
return this ;
}
}
// 返回接口方法：change、gose
return {
change : Action.changeState,
goes : Action.goes
}
}

// 测试实例：
console.log('使用状态后的值：---------') ;

// 直接执行这个状态类
// MarryState()
//  .change('jump', 'shoot')    // 添加跳跃与设计动作
//  .goes()                     // 执行动作
//  .goes()                     // 执行动作
//  .change('shoot')            // 添加射击动作
//  .goes() ;                   // 执行动作

// 实例化这个状态类
// 创建一个
var marry = new MarryState() ;
marry
.change('jump', 'shoot')
.goes()
.goes()
.change('shoot')
.goes() ;
</script>

</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理
标签： 设计模式状态模式
相关文章推荐
新的分享
章节导航