MVC是什么?

MVC是一种架构设计模式，它通过关注点分离鼓励改进应用程序组织。

每个模块都可以写成三个对象，分别是：

M - Model（数据模型）负责操作所有数据

const m = {
  //数据
  data: {},
  //数据的增删改查
  create() {},
  delete() {},
  update() {},
  get() {}
}

V - View（视图）负责所有UI界面

const v = {
  //元素
  el: null,
  html: ``,
  init() {},
  render(n) {}
}

C - Controller（控制器）负责其他

const c = {
  init() {},
  events: {},
  autoBindEvents() {}
}

MVC模式的目的是实现一种动态的程序设计，使后续对程序的修改和扩展简化，并且使程序某一部分的重复利用成为可能。除此之外，此模式透过对复杂度的简化，使程序结构更加直观。

EventBus

介绍

EventBus 事件总线，通常作为多个模块间的通信机制，相当于一个事件管理中心，一个模块发送消息，其它模块接受消息，就达到了通信的作用。

结合jQuery在MVC中的使用

const eventBus = $(window)
// 此时eventBus就有了on、trigger方法

eventBus.trigger('eventName')
// 触发eventName事件

eventBus.on('eventName', () => {})
// 监听eventName事件，事件触发后执行箭头函数

表驱动编程

当存在大批类似但不重复的代码时，可以将其中重要数据做成哈希表，以简化代码。

使用if-else的代码：

const getWeek = (value) => {
    if(value === 1){
        return "星期一";
    }else if(value === 2){
        return "星期二";
    }else if(value === 3){
        return "星期三";
    }else if(value === 4){
        return "星期四";
    }else if(value === 5){
        return "星期五";
    }else if(value === 6){
        return "星期六";
    }else if(value === 0){
        return "星期日";
    }
}

使用表驱动编程：

const getWeekMap = {
    "1": "星期一",
    "2": "星期二",
    "3": "星期三",
    "4": "星期四",
    "5": "星期五",
    "6": "星期六",
    "0": "星期日"
    }
const getWeek = (value) => {
    return getWeekMap[value]
}

我如何理解模块化

模块化是把一个大的代码块拆分成若干个小片段（模块）的过程，然后就可以在其他模块中调用这些模块了。代码的模块化非常类似于数据的规范化，得到的好处是相同的，而且还有一些额外的优点。利用模块化，我们的代码可以：

重用性更好

通过把一大段代码或者整个程序分解成独立的"即插即用"的组件，我们经常发现，许多模块其实可以被当前应用中的其他程序使用。只要有良好的设计，这些工具程序甚至可以用于其他应用程序。

管理性更好

一个1000行的程序或者5个单独的每个只有200行的并且互相调用的程序，你更愿意调试哪一个？在处理小任务时，我们的注意力会更加集中，也能处理的更好。我们可以在每个程序范围进行测试和调试（也叫做单元测试），然后再把这些独立的模块合并起来，进行一个更复杂的集成测试。

可读性更好

模块可以被命名，可以通过名字来描述其行为。通过程序接口隐藏起来的代码越多，程序行为就越容易阅读和理解。通过模块化，我们可以更专注于程序全局而不是一个个单独的可执行语句。我们甚至可以实现最隐蔽的软件：完全自我说明的代码。

更可靠的代码

按照模块化思路生成的代码的错误会更少。而且就算是有错误，也会因为它们已经被隔离在模块范围中而更容易被修正。而且，由于代码量更少并且可读性更好，我们维护起来也更容易。