MVC

MVC是一种架构设计模式，将一个应用程序分为了三个部分：视图层，数据层和控制层。通过对应用程序分层，可以将应用的各个模块之间解耦，使得各个模块的逻辑更加清晰，更符合最小知识原则。

• M-Model（数据模型）负责操作所有数据，用于保存和处理页面中展示的数据，在数据发生变化时，同时视图层重新渲染视图。
• V-View（视图）负责所有UI界面，定义了页面的UI布局，同时处理当数据变化时，UI如何渲染的问题。
• C-Controller（控制器）负责其他，用于处理用户与视图交互，用户对数据的改变等逻辑。

// 示例
const m = {
    data:{数据源},
    create(){增加数据},
    delete(){删除数据},
    update() {改}
    get() {查}
}

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

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

EventBus

EventBus 又称为事件总线，可以用来进行组件之间的监听和通信。

EventBus API

• EventBus.on() 监听事件：当'event'触发时，执行内容
• EventBus.trigger() 触发事件：当一个事件执行，EventBus触发
• EventBus.off() 解绑事件：当事件存在时，其余参数完全匹配

//  触发事件：注意事件名不能有空格
eventBus.trigger('m:update')  
//监听事件
 eventBus.on('m:update',()=>{ // 名字不能有空格
            v.render(m.data.n)
            localStorage.setItem('x', m.data.n)
        })

表驱动编程

表驱动法是一种编程模式(scheme)——从表里面查找信息而不使用逻辑语句(if和case)
表驱动编程是一种很重要的编程思想，它的理念是从大量相似的代码中抽取出本质的东西，组成哈希表，利用表进行编程，以减少重复代码。

//示例
//假设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 '星期六';
    }
}

可以优化为：

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

对于模块化的理解

将一个复杂的程序根据一定的规则，封装成几个模块进行组合。
其内部的数据实现是私有的，只对外提供接口进行通信。
模块化可以降低代码耦合度，减少重复代码，提高代码重用性，并且在项目结构上更加清晰，便于维护。