MVC可以说是一种设计模式。

那么设计模式又是什么？简单来讲就是一种对代码的优化方案。

当我们构筑代码时，一而再再而三地出现重复代码甚至

类似地页面重复数次，就会发现代码十分冗余，这时就要引入MVC等设计模式来优化代码，做到Don’t Repeat Yourself。

MVC具体指什么？

MVC将代码分为三个部分，分别是

M：Model 数据模型 负责操作所有数据

V：View 视图 负责所有UI界面

C：Controller 控制器 负责其他

  1.  //将数据存储进m，作为整个地m，其他两个也是类似的
  2.  const m = {    
  3.     get() {},
  4.     set(n) {}
  5.   }

EventBus

EventBus拥有on,trigger等事件,可以用作组件间的通信。在MVC中可以使用EventBus用于通信。

EventBus 基本的 API 有 on（监听事件），trigger （触发事件）, off （取消监听）方法。

  1. constructor(){
  2.     this._eventBus =$(window)
  3. }
  4. on(eventName, fn){
  5.     return this._eventBus.on(eventName,fn)
  6. }
  7. trigger(eventName,data){
  8.     return this._trigger.tiggger(eventName,data)
  9. }
  10. off(eventName, fn){
  11.     return this._eventBus.off(eventName,fn)
  12. }

表驱动编程

表驱动法是一种编程模式(scheme)——从表里面查找信息而不使用逻辑语句(if和case)。事实上，凡是能通过逻辑语句来选择的事物，都可以通过查表来选择。对简单的情况而言，使用逻辑语句更为容易和直白。但随着逻辑链的越来越发杂，查表法也就愈发显得更具吸引力。

简单来讲就是通过观察重复代码，将其归纳简化为较短的代码

  1. //如下是一串重复多次的代码
  2. bindEvents(){
  3.     v.el.on('click','#add1',()=>{
  4.     m.data.n +=1
  5.     v.render(m.data.n)
  6.     })
  7.     v.el.on('click','#minus1',()=>{
  8.     m.data.n-=1
  9.     v.render(m.data.n)
  10.     })
  11.     v.el.on('click','#mul2',()=>{
  12.         m.data.n*=2
  13.         v.render(m.data.n)
  14.     })
  15.     v.el.on('click','#divide2',()=>{
  16.         m.data.n/=2
  17.         v.render(m.data.n)
  18.     })
  19. }
  21. //通过观察代码，可以将上述代码优化为
  22. events:{
  23.     'click #aa1':'add',
  24.     'click #minus1':'minus',
  25.     'click #mul2':'mul',
  26.     'click #divide2':'div'
  27. },
  28. add(){
  29.     m.update( data: {n:m.data.n +1})
  30. },
  31. minus(){
  32.     m.update( data:{n:m.data.n -1})
  33. },
  34. mul(){
  35.     m.update( data: {n:m.data.n *2})
  36. },
  37. div(){
  38.     m.update(data: {n:m.data.n /2})
  39. }

模块化

简单的代码使用模块化反而复杂，但是越是大型的项目模块化能让其变得更加清晰分明。

将一个复杂的程序依据一定的规则（规范）封装成几个块（文件）并进行组合。

模块的内部数据的实现是私有的，只是向外部暴露一些接口（方法）与外部其他模块通信。这则就是模块化。

模块化可以降低代码耦合度，减少重复代码，提高代码重用性，并且在项目结构上更加清晰，便于维护。

模块化的几个好处：

1、避免变量污染，命名冲突

2、提高代码的复用率

3、提高维护性

4、修改代码只会改动一处模块，而不会牵一发而动全身