什么是MVC

MVC即Model, View, Controller的缩写，它是一种设计模式。 MVC认为程序可以被分为三个大的类。

Model Model中封装了与程序有关的数据及其方法

Model = {
    data: { //存储数据 }，
    create: { //增 },
    delete: { //删 },
    update(data) { //改
       Object.assign(m.data, data) 
       eventBus.trigger('m:upate') // eventBus触发'm:update'信息, 通知View刷新 
    },
    get:{ //查 } 
}

View View是对数据的展示，展示的内容就是Model中的data

View = {
    el: //待渲染的元素
    html: `<div> ... <div> `
    init(){
        v.el: 
    },
    render(){ //渲染 }
}

Controller Controller用于控制数据的改变，对用户输入做出响应等

Controller = {
   init(){
      v.init() // View初始化
      v.render() // 渲染
      c.autoBindEvents() // 自动的事件绑定
      eventBus.on('m:update', () => { v.render() }) // 当eventBus触发'm:update'时View刷新
   },
   events:{ //事件以哈希表方式记录 }，
   method() {
      data = //改变后的新数据
      m.update(data)
   }，
   autoBindEvents() { //自动绑定事件 }
}EventBus

EventBus

常用的API
- on
- trigger
- off

其中 on 对事件添加监听，trigger用于触发事件， off取消监听

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

EventBus的的作用
- 作为胶水层使用，减少模块间的耦合度
- 减少重复代码，提高代码可复用度

表驱动编程

所谓的表驱动编程，指的是把一大堆的if...else这样的逻辑处理，转化成从一个hash表中查找查找key-value对的过程，如下：

if(a){}
else if(b){}
else if(c){}
else if(d){}

把上面这一大串的if...else转化成如下形式：

{
    'a' : 'xxx'
    'b' : 'yyy"
    'c' : 'zzz'
    'd' : 'QAQ"
}

这样做的好处有：

提高了程序的可读性
减少了重复代码
更强的可扩展性

我对于模块化的理解

模块化可以使得程序员专注于一小块内容
模块化可以降低代码耦合度
模块化使得程序更容易维护，哪里出错了就去哪个模块该BUG
模块化使得代码的可利用率变高
不同模块可以使用不同的技术

浅析 MVC

什么是MVC

EventBus

表驱动编程

我对于模块化的理解