JS设计模式之MVC模式

MVC模式

model(模型) - view(视图) - controller(控制器)

'use strict';

// 初始化MVC对象
var MVC = MVC || {};

// 数据模型层
MVC.model = (function () {
  // 内部数据对象
  var M = {};

  // 服务端获取的数据,通常通过ajax获取并存储
  // 缓存起来,减少异步请求操作
  M.data = {};

  // 配置数据,页面加载时即提供
  M.conf = {};

  return {
    getData: function (m) {
      return M.data[m];
    },
    getConf: function (c) {
      return M.conf[c];
    },
    setData: function (m, v) {
      M.data[m] = v;
      return this;
    },
    setConf: function (c, v) {
      M.conf[c] = v;
      return this;
    }
  };
})();

// 视图层
MVC.view = (function () {
  // 模型数据层对象操作方法引用
  var M = MVC.model;

  // 内部视图创建方法
  var V = {};

  return function (v) {
    // 根据视图名称返回视图(由于获取的是一个方法,所以需要执行一边方法获取视图)
    V[v]();
  };

})();

// 控制器层
MVC.ctrl = (function () {
  // 模型数据层对象操作方法引用
  var M = MVC.model;
  // 视图层对象操作方法引用
  var V = MVC.view;

  // 控制器创建方法对象
  var C = {};

  // 执行
  for (var i in C) {
    C[i] && C[i]();
  }
})();

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容