浅析MVC

MVC 是什么?

• MVC 是一种设计模式：将项目中的代码按照其作用大致分成三个版块，然后整合到三个对象内（M、V、C），达到代码简洁、结构清晰、功能灵活、可操作性强等目的。

三个对象

• M - Model（数据模型）负责操作所有数据

// 项目数据对象m，调用对象属性实现增删改查
const m = {
  data: {},
  create() {},
  delete() {},
  update(data) {},
  get() {}
}

• V - View（视图）负责所有 UI 界面

// 项目界面的渲染相关内容
const v = {
  el: null,
  html: `html格式代码`,
  init(container) {
    v.el = $(container)
  },
  render(n) {}
}

• C - Controller（控制器）：负责视图和数据的某种联系逻辑，以及其他

const c = {
  init(container) {},
  events: {},
  add() {},
  autoBindEvents() {}
}

EventBus常用的API及作用

EventBus中常用API分别是：on、trigger、off

• EventBus.on( ):监听事件

this.on('m:updated', () => {
      this.render(this.data)
    })

- EventBus.trigger( )：触发事件

update(data) { Object.assign(m.data, data)
eventBus.trigger('m:updated')// 更新数据 

• EventBus.off():用来取消绑定事件

表驱动编程的作用

即将大量重复的代码进行重构，用哈希表存储重复的数据。当调用数据时遍历哈希表，通过所得的key得到对应的数据。

模块化是什么

• 模块化的大致思想是将大量的代码进行整合。
• 按照功能模块化：一般的做法是按照代码在项目中的功能大致分为几类（视图类，数据类，控制类等）,这些类别声明成对象。将代码放入相应的对象中，使其作为对象的相关属性，供调用。
• 重复代码模块化：将大量重复的代码封装成函数;或者转化成数据存储到一个整体内，根据需求取用。
• 小功能模块整合：例如a，b两个小功能模块存在某种联系，将b模块转化为a模块的一部分，当执行的a的同时也执行了b。
• 模块化的优点
  • 代码形式上简洁，避免了重复，项目的结构清晰
  • 项目的可维护性强
• 局限性
  • 在大型项目中的作用明显，但是在小型项目中的作用很小甚至浪费时间
  • 受限于开发者的水平，某些业务实现逻辑反而会导致内存浪费，影响性能