浅析MVC

2021-02-22  本文已影响0人  卢卢2020

MVC 三个对象分别做什么

M : Model数据模型 负责操作所有数据

V :View视图 负责所有界面

C :Controller 负责其它

EventBus 有哪些 API,是做什么用的

eventBus.trigger 触发事件

    update(data){

      Object.assign(m.data,data) //把data的所有属性 赋值给m.data

        eventBus.trigger('xxx') //触发我更新的data

     }

eventBus.on 监听事件

enentBus.on('xxx',()=>{
    v.render(m.data.n)
})

注:先触发 再监听

const eventBus = $({})  //或者const eventBus = $(window) 

console.log(eventBus) //查看所有enentBus属性

表驱动编程是做什么的

表驱动编程是一种很重要的编程思想,它的理念是从大量相似的代码中抽取本质的东西,组成哈希表,利用表进行编程,以减少重复代码

const events = {
    '#el1 事件1':'fn1',

     '#el2 事件2':'fn2',

      '#el3 事件3':'fn3',

      '#el4 事件4':'fn4',

      '#el5 事件5':'fn5',
}

//事件处理函数(以下)

const eventFunction = {
fn1(){}

fn2(){}

fn3(){}

fn4(){}

fn5(){}
}

function autoBindEvents(){
    for(let key in events){
        const spaceIndex = key.indexOf(' ')

        const element = key.slice(0,spaceIndex)    //得到各个' #el1-5 '

        const event = key.slice(spaceIndex +1) //得到各个'事件1-5'

        const fn = eventFunctions[events[key]] //得到各个fn

        $(element).on(event,fn)  //绑定事件

    }
}

去除了所有重复的代码  (事件较少是显示复杂) ,但是当事件越来越多时,就显得简洁,添加新事件只需要在events对象中添加即可,非常便捷

我是如何理解模块化的

前端应用程序功能越来越强大,代码量也越来越大。因此,我们将网页应用分为各个独立的模块开发,每个模块之间互不影响 ,可以使结构更加清晰方便维护。

上一篇下一篇

猜你喜欢

热点阅读