什么是MVC
M-Model（数据模型）负责操作所有数据
//示例
let Model = {
data: { 数据源 },
create: { 增加数据 },
delete: { 删除数据 },
update(data) {
Object.assign(m.data, data); //用新数据替换旧数据
eventBus.trigger("m:update"); //eventBus触发'm:update'信息，通知View刷新界面
},
get: { 获取数据 },
};
V-View（视图）负责所有UI界面
//示例
let View={
el:要刷新的元素，
html：'要显示在页面上的刷新内容'
init(){
v.el:初始化需要刷新的元素
}，
render(){
刷新页面
}
}
C-Controller (控制器) 负责其他（根据用户从“视图层”输入指令，选取“数据层中的数据”，对其进行相应的操作(绑定事件等），产生最终结果）
let Controller={
init(){
v.init()//初始化View
v.render()//第一次渲染页面
c.autoBindEvents()//自动的事件绑定
eventBus.on('m:update',()=>{v.render()}//当enentsBus触发'm:update'是View刷新
}，
events:{事件以哈希表的方式记录存储},
//例如：
events: {
'click #add1': 'add',
'click #minus1': 'minus',
'click #mul2': 'mul',
'click #divide2': 'div',
},
add() {
m.update({n: m.data.n + 1})
},
minus() {
m.update({n: m.data.n - 1})
},
mul() {
m.update({n: m.data.n * 2})
},
div() {
m.update({n: m.data.n / 2})
},
method(){
data=新数据
m.update(data) // controller 通知 model去更新数据
},
autoBindEvents(){
for (let key in c.events) { // 遍历events表，然后自动绑定事件
const value = c[c.events[key]]
const spaceIndex = key.indexOf(' ')
const part1 = key.slice(0, spaceIndex) // 拿到 'click'
const part2 = key.slice(spaceIndex + 1) // 拿到'#add1'
v.el.on(part1, part2, value)
}
}
这三层是紧密联系在一起的，但又是互相独立的，每一层内部的变化不影响其他层。每一层都对外提供接口（Interface），供上面一层调用。这样一来，软件就可以实现模块化，修改外观或者变更数据都不用修改其他层，大大方便了维护和升级。
EventBus
前面提到MVC三层是紧密联系在一起的，但又是互相独立的，每一层内部的变化不影响其他层。当层与层之间需要通信时，这时就需要用到EventBus。EventBus主要用于组件之间的监听与通信。
常用API
EventBus.on（）监听事件
EventBus.trigger（）触发事件
EventBus.off（）取消监听事件
表驱动编程
随着逻辑复杂性的增加，if/else 或switch中的代码将变得越来越肿，代码可读性不强。所谓的表驱动程序，指的是把一大堆的if...else这样的逻辑处理，转化成从一个hash表中查找key--value对的过程。
-
好处
减少了大量重复代码
提高了代码的可读性
模块化
在一个完整的页面应用中，不同的节点功能，不同的结构可以规划为多个模块，每个模块的实现的方式以及用到的技术大不相同，使用模块化编程可以减小各个模块之间的影响和联系，可以更方便的优化代码和重构代码，提高我们代码的重用性，便于后期维护
