1. MVC
MVC是一种架构设计模式，把软件系统分为三个基本的部分：模型（Model）、视图（View）、和控制器（Controller）。
- Model负责处理数据相关的部分 Model是应用程序中用于处理应用数据逻辑的部分，会有一个或多个视图监听此模型。一旦模型的数据发生变化，模型将通知有关的视图。
Model = {
data: { 应用数据 },
create() { 增加数据 },
delete() { 删除数据 },
update() { 更新数据,eventBus.trigger('m:update')//触发事件 },
get() { 获取数据 }
}
- View负责处理与UI相关的部分 视图view是它在屏幕上的表示，描绘的是model的当前状态。当模型的数据发生变化，视图相应地得到刷新自己的机会。
View = {
el: null,
html: `……`,//视图模版
init() { 初始化UI },
render() { 更新UI }
}
- Controller负责处理业务逻辑操作，处理事件并做出响应 控制器controller定义用户界面对用户输入的响应方式，起到不同层面间的组织作用，用于控制应用程序的流程，它处理用户的行为和数据model上的改变。
Controller = {
init(){
v.init() // 初始化View
v.render() // 第一次渲染UI
c.autoBindEvents() // 事件绑定
eventBus.on('m:update', () => { v.render() }) // 当eventBus触发'm:update'时更新UI
},
events:{ 事件以哈希表方式记录 }，
method() {
data = 改变后的新数据
m.update(data) //更新数据
}，//预先定义好的数据处理函数
autoBindEvents() { 自动绑定事件 }
}
2. EventBus
又称事件总线，用来进行组件之间的监听与通信。
EventBus {
on(){监听事件动作},
trigger(){触发事件动作}，
off(){取消监听事件}
}
如以上MVC中的代码中，控制器Controller初始化时使用eventBus监听'm:update'事件，模型Model中的update函数会触发该事件。由于每次data修改后都会使用update，所以每次触发该事件后会重新调用render更新UI。
3. 表驱动编程
表驱动方法是一种使你可以在表中查找信息，而不必用逻辑语句（if 或 case）来把他们找出来的方法。事实上，任何信息都可以通过表来挑选。
以下代码用于绑定事件
bindEvents(){
v.el.on('click', '#add', () => {
})
v.el.on('click', '#minus', () => {
})
v.el.on('click', '#mul', () => {
})
v.el.on('click', '#divide', () => {
})
}
但以上代码重复性较高，使用表驱动编程，将数据提取在一个表中，实现逻辑与数据的分离。
events: {
'click #add' : 'add',
'click #minus' : 'minus',
'click #mul' : 'mul',
'click #divide' : 'div'
},
add() {},
minus() {},
mul() {},
div() {}.
bind(){
遍历event对象（哈希表），进行事件绑定
}
4. 模块化
将一个复杂的程序依据一定的规则（规范）封装成几个块（文件）并进行组合。 模块的内部数据的实现是私有的，只是向外部暴露一些接口（方法）与外部其他模块通信。这则就是模块化。
模块化将实现不同功能的代码分离为不同的文件，在使用时再引入对应功能的文件。模块化可以避免变量污染，命名冲突，降低代码耦合度，减少重复代码，提高代码重用性，并且在项目结构上更加清晰，便于维护。
