浅谈MVC

什么是MVC

MVC 模式代表 Model-View-Controller（模型-视图-控制器） 模式。这种模式用于应用程序的分层开发。

MVC的三个对象

• M: Model（模型） - 模型model用于封装与应用程序的业务逻辑相关的数据以及对数据的处理方法，会有一个或多个视图监听此模型。一旦模型的数据发生变化，模型将通知有关的视图。负责操作所有数据，数据管理，主要负责和服务器进行交互。将请求到的数据传给Controller。

const  Model={
   data:{数据源},
   create:{增加数据},
   delete:{删除数据},
   update(data){
       Object.assign(m.data,data) //用新数据替换旧数据
       eventBus.trigger('m:update') //eventBus触发'm:update'信息，通知View刷新界面
   }
   get:{获取数据}
}

• View（视图） - 视图代表模型包含的数据的可视化,负责所有 UI 界面。

const View ={
    el:要刷新的元素，
    html:'要显示在页面上的内容'
    init(){
        v.el:需要刷新的元素
    },
    render(){
        刷新页面
    }
}

• Controller（控制器） - 控制器作用于模型和视图上。它控制数据流向模型对象，并在数据变化时更新视图。它使视图与模型分离开。存放除数据和视图以外代码的地方。

const Controller={
   init(){
       v.init()//初始化View
       v.render()//第一次渲染页面
       c.autoBindEvents()//自动的事件绑定
       eventBus.on('m:update',()=>{v.render()})
       //当enentsBus触发'm:update'是View刷新
   },
   events:{事件以哈希表的方式记录存储},
   method(){
       data=新数据
       m.update(data)
   },
   autoBindEvents(){自动绑定事件}
}

EventBus

EventBus 是一个开源库，它利用发布/订阅者者模式来对项目进行解耦。它可以利用很少的代码，来实现多组件间通信。如下图，Publisher（发布者）通过post()方法，把Event事件发布出去，Subscriber（订阅者）在onEvent()方法中接收事件。
subscriber ——> EventBus 的register方法，传入的object对象
事件（Event）——> EventBus 的post方法，传入的类型。
publisher（发布者）——> EventBus的post方法。
为什么选择使用EventBus来通信？

• 简化了组件间交流的方式
• 对事件通信双方进行解耦
• 可以灵活方便的指定工作线程，通过ThreadMode
• 速度快，性能好
• 库比较小，不占内存
• 使用这个库的app多，有权威性
• 功能多，使用方便
  EventBus的基本API有on(监听事件)、trigger(emit)(触发事件)、off(取消监听)，用于模块间的通讯。

eventBus.trigger('m:updated') // 触发事件
eventBus.on('m:updated', () => { console.log('here') }) '监听事件，听到后执行函数'

表驱动编程

表驱动法是一种编程模式，从表里面查找信息而不是使用逻辑语句。在简单的情况下，逻辑语句往往更简单而且更直接。但随着逻辑链的复杂，表就变得越来越富有吸引力了。在JS中，表就是指的哈希表结构，使用表驱动编程，能使重复冗余的代码变的稳定简洁。
举个例子：
1.使用逻辑语句
假设day的起始值为1，以下代码就是为了输出某天是星期几

function weekday(day) {
    if(day&7===0){
  	  return '星期天';
    }
    else if(day%7===2){
  	  return '星期二';
    }
    else if(day%7===3){
  	  return '星期三';
    }
    else if(day%7===4){
  	  return '星期四';
    }
    else if(day%7===5){
  	  return '星期五';
    }
    else if(day%7===6){
  	  return '星期六';
    }
}

2.使用表驱动编程

function week(days){
	let weekdays=['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
  return weekdays[days%7];
}

同样的结果，表驱动编程使重复冗余的代码变的稳定简洁。

我对模块化的理解

模块化是指将一个大文件拆分成多个独立相互依赖的小模块，这些模块可组合、分解和更换，各个模块相互独立，互不影响。简单理解模块化就是在一个js文件中能够引入另一个js文件。模块化提高了代码的复用性和可维护性，可以实现按需加载，防止变量污染。模块规范的好处：就是大家都遵守同样的模块化规范写代码，这样就降低了沟通成本，极大的方便了各个模块之间的相互调用。

总结

• 同样的代码写三遍，就应该抽成一个函数。
• 同样的属性写三遍，就应该做成共有属性（原型或类）
• 同样的原型写三遍，就应该用继承