什么是MVC?
什么是MVC?我相信这句话是很多新手前端在学完MVC的理论知识后内心的真实写照，同样我学完后也是这个问题。好像我懂了但是好像我又没懂（内心OS：这是个啥玩意怎么那么烦）。当你第一遍看到MVC啊好像很方便，摆脱了面条式代码逐渐让自己的代码工程化，变成了一块一块“豆腐”。但是再往下学，什么eventBus，封装成MVC三个对象啊就懵逼了。学完后感觉就是啊我好像理解了。又好像完全不懂。事实上MVC确实是一种非常抽象的思想；而我们要做到的是在脑中既要能存非常形象的知识也要能存储抽象的知识
那么接下来我将说说我对MVC的理解，当然如果您觉得我所写的MVC与您所理解的不太一样，您可以私信告知我我们讨论一下，本人水平有限，文章仅供参考（一千个人心中，有一千个哈姆雷特，同样也有一千个MVC）
- MVC 三个对象分别做什么，给出伪代码示例
- EventBus 有哪些 API，是做什么用的，给出伪代码示例
- 表驱动编程是做什么的（可以自己查查资料）
- 我是如何理解模块化的
（1）MVC三个对象分别做什么
每个模块都可以写成三个对象，分别是M、V、C
M-Model（数据模型）负责操作所有数据
Model = {
data: { 需要用到的数据 }，
create(): { 增数据 },
delete(): { 删数据 },
update() {更新数据},
get():{ 获取数据 }
}
V-View（视图）负责所有UI界面
View = {
el:null,
html: `......` //视图模板
init(){初始化页面},
render(){ 刷新页面 }
}
C-Controller（控制器）负责其他
Controller = {
init(){
v.init() // View初始化
v.render() // 第一次渲染
c.autoBindEvents() // 自动的事件绑定
eventBus.on('m:update', () => { v.render() }) // 当eventBus触发'm:update'时View刷新
},
events:{ 事件以哈希表方式记录 }，
method() {
data = 改变后的新数据
m.update(data)
}，
autoBindEvents() { 自动绑定事件 }
（2）EventBus有哪些API，是做什么用的
一种设计模式或框架，主要用于组件/对象间通信的优化简化。
EventBus里面涉及到很多API，下面我就列举几个常用，并对它们的用法进行分析。这个EventBus我们在运用的时候通常是这么来引入的：
const eventBus = $(window)
放在window上的，但是我今天想说的是这样用起来不爽，每一个模块一开始都要通过这样的方式来引入它；我们是否可以考虑通过继承的方式把它放在原型上呢？
import $ from 'jquery'
class EventBus {
constructor() {
this._eventBus = $(window)
}
on(eventName, fn) {
return this._eventBus.on(eventName, fn)
}
trigger(eventName, data) {
return this._eventBus.trigger(eventName, data)
}
off(eventName, fn) {
return this._eventBus.off(eventName, fn)
}
}
export default EventBus
EventBus中常用API分别是：on、trigger、off;
on:监听事件的变化
监听数据的变化，如果数据有变化，直接render（再次将变化后的数据渲染到页面）
this.on('m:updated', () => {
this.render(this.data)
})
tirgger:自动触发事件
update(data) {
Object.assign(m.data, data)//把传进来的data直接放在m.data上
eventBus.trigger('m:updated')//通过trigger自动更新数据
localStorage.setItem('n', m.data.n)//储存数据
off：接触绑定事件。
（3）表驱动编程是做什么的
首先我们来看下面这一段代码，if else 程序员肯定很熟徐，在判断中常用多重嵌套if else，虽然这样的写法非常简单。但是也造成了代码过长，就像面条一样，那么如何优化他呢？这里我们就要引用表驱动编程的思想。
getweek(value){
this.dayOfWeek = value;
if(this.dayOfWeek == 1){
this.Week = "星期一";
}else if(this.dayOfWeek == 2){
this.Week = "星期二";
}else if(this.dayOfWeek == 3){
this.Week = "星期三";
}else if(this.dayOfWeek == 4){
this.Week = "星期四";
}else if(this.dayOfWeek == 5){
this.Week = "星期五";
}else if(this.dayOfWeek == 6){
this.Week = "星期六";
}else if(this.dayOfWeek == 0){
this.Week = "星期日";
}
}
let weekdayMap = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
this.Week = weekdayMap[value];
这样看是不是代码变得非常简洁了。
（4）我是如何理解模块化的
我所认为的模块化就是一块地方由一块的js文件进行操作，把原先挤在一个文件里面的代码封装分块成几个文件。最终使用引用的方式将他们连接。例如一个页面有四块需要实现独立的功能，那么就创建四个js文件分别进行编辑最终将他们引用到一个主文件上（import）然后再在页面上面引用js。
这样做到好处就是：模块化可以降低代码耦合度，减少重复代码，提高代码重用性，并且在项目结构上更加清晰，便于维护。
总结：MVC是一种每个人都有不同理解的思想，或许你学完后感觉自己理解了然而当你想说出来却发现说不出来。因为他的思想是抽象的，越抽象的东西越是难以形容。但是这不妨碍我们对他进行理解吸收，例如三大框架之一的Vue也是使用的MVC。
