重构与设计模式

重构与设计模式

1. 状态模式
对象行为的行为依赖于它所处的状态，对象的行为随着状态的改变而改变。解决不同状态下，行为不同的问题。

问题：

左边树状结构，选择不同节点，右边Viewer显示该节点下图片；左边树下方search框，右边Viewer显示满足search条件的图片。抽象出Viewer对象，有两个不同状态view和search，不同状态下更新Viewer的方式不同，即
tree.onselect -> state="view"
search -> state="search"

if(state="view"){
  updateView(path,start,limit)
}else if(state="search"){
  updateSearch(path,start,limit,searchCriteria)
}

Viewer, search, tree耦合在一起，需要全局变量state。

解决方案：

抽象两个状态对象
viewAction ->  updateView(path,start,limit)
searchAction -> updateSearch(path,start,limit,searchCriteria)

Viewer对象
变量 updateAction
方法 setUpdateAction(action)
方法 update()调用 -> updateAction()

状态改变时，改变所选的状态对象
tree.onselect -> Viewer.setUpdateAction(viewAction)
search -> Viewer.setUpdateAction(searchAction)

Viewer, search, tree解藕，去除了全局变量state，行为局域化。假如以后加入view，search外的其他状态，只需增加newAction状态对象，并在调用处添加Viewer.setUpdateAction(newAction)，便于扩展，无需改变现有代码。

2. 不知道该叫什么模式
 
问题：右键事件
if(action=="addTag"){
  addTag()
}
if(action=="replaceTag"){
replaceTag()
}

if(action=="addSubjectTag"){
addSubjectTag()
}

if(action=="addCredit"){
addCredit()
}

增加新事件需要添加新的if语句

--------------------------->
中间过程
var items={
  "addTag":addTag,
  "replaceTag":replaceTag,
  "addSubjectTag":addSubjectTag,
  "addCredit":addCredit
}

perform(){
 items[action]()
}

--------------------------->
事件注册，提供注册接口
var items = {}

perform(){
 items[action]()
}

register(option){
 items.add(option)
}

增加右键事件时，只需自行注册，事件的执行与事件本身完全解藕，同时新事件加入时，只需注册，无需改变现有代码。
regsiter({"addTag":addTag})
regsiter({"replaceTag":replaceTag})
regsiter({"addSubjectTag":addSubjectTag})
regsiter({"addCredit":addCredit})