MVC
MVC分别是Model、View、Controller的缩写，分别表示数据模型、视图、控制器，是一种开发过程中的架构设计模式，使用一种设计模式进行开发，能够有效地避免“意大利面条式代码”，让开发过程变得更加有效。
M（数据模型）
主要用于封装与应用程序的业务逻辑相关的数据以及对数据的处理方法，会有一个或多个视图监听此模型，一旦模型的数据发生变化，模型将通知有关的视图。伪代码示例如下：
const m = {
data: {定义所需的数据},
add() {添加数据的方法},
delete() {删除数据的方法},
update() {更新数据的方法},
get() {查找数据的方法}
}
V（视图）
用于屏幕上的表示，描绘model的当前状态，当模型的数据发生变化，视图相应地得到刷新自己的机会。伪代码示例如下：
const v = {
el:null, //挂载元素
template:'', //定义页面的模板
init: function(){}, //初始化页面
render: function(){} //渲染页面视图
}
C（控制器）
定义用户界面对用户输入的响应方式，起到不同层面间的组织作用，用于控制应用程序的流程，它处理用户的行为和数据model上的改变，除开 M 和 V 中的内容。伪代码示例如下：
const c = {
init(): function{ //初始化
v.render(); //第一次渲染
c.bindEvents();//绑定事件
},
bindEvents: function(){}, //绑定事件函数
······ //其他函数
}
EventBus
EventBus是一种发布订阅设计模式，也称为观察者设计模式，它能够简化组件间的通讯，分离事件的发送者和接受者，使代码更简洁。常用的api有on()、off()、trigger()等。
on()：绑定事件（相当于订阅消息）
trgger()：触发事件（相当于发布消息）
off()：移除事件（相当于移除消息）
const EventBus = $(window);
// 订阅消息
function subscribe() {
EventBus.on('first-event', function (msg) {
alert(`订阅的消息是：${msg}`);
});
}
// 发送消息
function trigger() {
const msgInput = document.getElementById("msgInputId")
EventBus.trigger('first-event', msgInput.value)
}
// 移除消息
function off(msgName) {
EventBus.off(msgName)
}
表驱动编程
表驱动编程是一种使你可以在表中查找信息，而不必用很多的逻辑语句（if或Case）来把它们找出来的方法，其实任何信息都可以通过表来挑选，在简单的情况下，逻辑语句往往更简单而且更直接，但随着逻辑链的复杂，使用在表中遍历查找进行操作的方法更简便清晰。例如下例中循环遍历eventsHash来绑定事件。
const obj = {
eventsHash: {
'#add1': 'add1',
'#minus1': 'minus1',
'#mul2': 'mul2',
'#divided2': 'divided2'
},
bindEvents() {
for (let key in c.eventsHash) {
$(key).on('click', () => {
console.log('点击了')
})
}
}
}
模块化
模块化编程，是强调将计算机程序的功能分离成独立的、可相互改变的模块的设计思想，它使得每个模块都包含着执行预期功能的一个唯一方面所必需的所有东西，通过模块化编程，可以降低各业务模块之间的代码黏度，各个业务模块独立控制，相互之间不受影响，更有利于对代码的维护和操纵。
