MVC是什么

M，Model，数据模型，负责操作所有数据；
V，View，视图，负责所有 UI 界面；
C，Controller，控制器，负责其他；
原始mvc模型的伪代码如下:

// m表示数据模型，包含数据本身，以及对数据的操作
const m = {
	data : {}
	create(){}
	delete(){}
	update(){}
	get(){}
}
// v表示视图，包含具体的ui信息，ui的渲染等
const v = {
	ui: {}
	render: {}
}
// c表示控制器，负责其他的工作，比如对视图和数据的初始化，比如利用数据实现特定的业务
const c = {
	init(){}
	events: {}
	autoBindEvents(){}
	businessFunction1(){} // 业务实现
	businessFunction2(){} // 业务实现
	businessFunction3(){} // 业务实现
}

EventBus是什么

m持有数据，c可以操作数据，v渲染数据，那么，数据修改后，如何通知v重新渲染数据？
很简单，让c持有v，c修改数据m后，直接调用v的渲染方法，重新绘制视图
但是mvc互相持有，互相引用，违背了最小知识原则，增加了耦合度，
所以这里引入了一个新的数据通信方法，EventBus，负责全局通信。
EventBus有3个API:

on(eventName, fn) // 监听事件eventName，触发监听则回调fn函数
off(eventName, fn) // 取消监听事件eventName
trigger(eventName, data) // 触发事件eventName

mvc都持有EventBus对象，v中监听事件，数据修改后，调用trigger方法触发事件，v中的监听响应事件，实现数据通信，视图重绘。
实际上，mvc对象都可以继承EventBus，在mvc中，可以通过this设置监听，触发监听，实现通信。

表驱动编程是什么

表驱动编程可以让代码变"漂亮"一些，避免大量重复的"丑"代码。 从重复代码里提取出不同的部分，也就是重要数据，把重要的数据做成哈希表，遍历哈希表，用重复代码里重复的那部分逻辑，进行处理。 这是用事件委托的原则，对v对象el元素内加减乘数4个按钮的监听

v.el.on("click", "#add1", (e) => {
	m.data.n += 1;
})
v.el.on("click", "#minus1", (e) => {
	m.data.n -= 1;
})
v.el.on("click", "#mul2", (e) => {
	m.data.n *= 2;
})
v.el.on("click", "#divide2", (e) => {
	m.data.n /= 2;
})

通过表编程，避免了重复操作

events: {
    "click #add1": "add",
    "click #minus1": "minus",
    "click #mul2": "mul",
    "click #divide2": "divide",
},
autoBindEvents(){
    for(let key in  c.events){
        const value = c[c.events[key]]; // value是一个方法
        const keys = key.split(" ");
        v.el.on(keys[0],keys[1],value); // 绑定事件，但是没有重新渲染
    }
},
add(){
  m.data.n += 1;
},
minus(){
    m.data.n -= 1;
},
mul(){
    m.data.n *= 2;
},
divide(){
    m.data.n /= 2;
},
	

模块化是什么

在项目结构上，让彼此无关的功能，彼此无关的代码，物理上或者逻辑上，划分在不同的目录，各自开发。
通过模块化改造后，对某一个模块的程序进行阅读与修改时，不受到其他模块的影响。
在项目的总领文件，或者路由文件上，引入这些模块。
引入模块时，遵循最小知识原则，只引入模块保留的某js文件，而模块的html，css等，都在各自模块内引入。