MVC 三个对象及各自的作用
MVC 包括三类对象，将他们分离以提高灵活性和复用性。
- M 即 model 数据模型，用于封装与应用程序的业务逻辑相关的数据以及对数据的处理方法，会有一个或多个视图监听此模型。一旦模型的数据发生变化，模型将通知有关的视图。
- V 即 view 视图，是它在屏幕上的表示，描绘的是model的当前状态。当模型的数据发生变化，视图相应地得到刷新自己的机会。
- C 即 controller 控制器，定义用户界面对用户输入的响应方式，起到不同层面间的组织作用，用于控制应用程序的流程，它处理用户的行为和数据model上的改变。
代码示例如下：
const model = {
data: {
// 相关数据
n: localStorage.getItem('n')
},
// 对数据的一些处理方法
create() {},
delete() {},
update() {},
get() {}
}
const view = {
// 界面的显示
html: `
<div>
<span id="number">{{n}}</span>
</div>
`,
// 当模型的数据发生变化，视图重新渲染
render(n) {}
const controller = {
init() {},
// 监听用户事件、处理用户行为
events: {},
mul() {},
div() {},
autoBindEvents() {
for (let key in c.events) {
const value = c[c.events[key]]
const spaceIndex = key.indexOf(' ')
const part1 = key.slice(0, spaceIndex)
const part2 = key.slice(spaceIndex + 1)
v.el.on(part1, part2, value)
}
}
}
EventBus 的作用以及一些常用API
EventBus 主要用于对象间通信，它提供了 on、off 和 trigger 等 API，on 用于监听事件，off 用于取消事件监听， trigger 用于触发事件。使用 EventBus 可以满足最小知识原则，model 和 view 互相不知道对方的细节，但是却可以调用对方的功能。
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)
}
}
关于表驱动编程
《代码大全》对表驱动编程的描述：
表驱动方法是一种使你可以在表中查找信息，而不必用逻辑语句（if 或 case）来把他们找出来的方法。事实上，任何信息都可以通过表来挑选。在简单的情况下，逻辑语句往往更简单而且更直接。但随着逻辑链的复杂，表就变得越来越富于吸引力了。
这里的表指的是哈希表，表驱动编程可以减少重复代码，只将重要的信息放在表里，然后利用表来编程。
它的作用有：
- 可读性强，数据处理流程一目了然。
- 便于维护，只需要增、删数据索引和方法就可以实现功能。
- 精简代码，降低圈复杂度。减少if else、switch、case使用。
如何理解模块化
真正的模块化，并不是简单文本意义上的，而是与逻辑相关的有逻辑意义的。一个模块应该像一个集成电路芯片，我们能见到能使用的都很清晰，它定义了良好的输入和输出。
模块化开发其实就是封装细节，提供使用接口，彼此之间互不影响，每个模块都是实现某一特定的功能。
软件编程模块是一套一致而互相有紧密关联的软件组织，每个模块完成一个特定的子功能，所有的模块按某种方法组装起来，成为一个整体，完成整个系统所要求的功能，这就是真正的模块化。
模块化开发不仅使我们在编程时更加容易，同时也更利于维护代码。
本文参考：
