MVC 三个对象分别做什么，给出伪代码示例

• M即Model，即数据模型，负责数据相关的任务，包括对数据的增删改查
• V即View，视图层，即用户能看得到的界面
• C即Controller，控制器，负责监听用户事件，然后调用 M 和 V 更新数据和视图

MVC曾被大量用于构建桌面和服务器端应用，如今Web应用开发已经越来越向传统应用软件开发靠拢
因此传统编程语言中的设计模式也在慢慢地融入Web前端开发

Model 数据模型

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

View 视图层

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

Controller 控制器

let Controller={
    init(){
        v.init()//初始化View
        v.render()//第一次渲染页面
        c.autoBindEvents()//自动的事件绑定
        eventBus.on('m:update',()=>{v.render()}//当enentsBus触发'm:update'是View刷新
    }，
    events:{事件以哈希表的方式记录存储},
    //例如：
   events: {
    'click #add1': 'add',
    'click #minus1': 'minus',
    'click #mul2': 'mul',
    'click #divide2': 'div',
    },
    add() {
      m.update({n: m.data.n + 1})
    },
    minus() {
      m.update({n: m.data.n - 1})
    },
    mul() {
      m.update({n: m.data.n * 2})
    },
    div() {
      m.update({n: m.data.n / 2})
    },
    method(){
        data=新数据
        m.update(data) // controller 通知 model去更新数据
    },
    autoBindEvents(){
    	for (let key in c.events) { // 遍历events表，然后自动绑定事件
      const value = c[c.events[key]]
      const spaceIndex = key.indexOf(' ')
      const part1 = key.slice(0, spaceIndex) // 拿到 'click'
      const part2 = key.slice(spaceIndex + 1)  // 拿到'#add1'
      v.el.on(part1, part2, value)
    }
}

EventBus

EventBus 主要用于对象之间的通信，Model 数据模型 和 View 视图模型彼此不知道彼此的存在，但是又需要通信，于是就要用到 EventBus

EventBus 有哪些api

eventBus通常有触发trigger/emit，监听on，移除监听off这三个API
当Model中的数据更新时，则会trigger/emit一个事件，然后在controller 会用到 on 监听到这个事件, 然后controller会通知 view 模型去重新渲染页面

表驱动编程

这是一种对大量重复代码进行优化的手段，可以把大量重复代码中不同之处存入一个哈希表
然后用遍历的方式对代码进行操作

我是如何理解模块化的

模块化就是用class将代码中经典的属性抽象（提取）出来，让整体代码变得精简更具拓展性，方便以后的维护和修改

什么是抽象

• 同样的代码重复：抽象成函数
• 同样的属性重复：抽象成原型或类
• 同样的原型重复：使用继承