论MVC和MVVM,来个简单点理解

7年老coder,从美工做到前端开发,现在需要跳槽,看了下招聘信息提到需要对mvc和mvvm理解,干了这么多年实在惭愧,完全没时间去理解解释各种框架什么mvc  mvp mvvm,这个时候只能百度了,看了下那些绕口的解释,我想如果是个初学前端的肯定没法理解吸收,现在我就来说下我自己的体会。

1,开始我需要做一个企业门户,这个页面就是展示信息使用,可能涉及到一些动画效果,那么开发web前端的时候可能就只需要用到struts标签和一些简单的js效果库。则再前端只需要V和C既能完成;

2,开发一个web应用系统,现在有一个需求:有一个人员选择的input控件,需要弹出人员列表并选择人员,选择后input框中显示已选择人员的姓名;但是有个要求需要再提交给后台的数据里提交此人员的id信息,或者是电话号码信息,而非人员的姓名信息;并且每次做修改的时候后台交给前端的数据依然是id信息,需要将input框中的显示信息对应到姓名。

这种情况下MVC就能很好的解决这些需求,M存储实际的对应实际数据,V只做显示工作,C负责控制M和V的显示同步,每次与后台交互的时候都传递M中的实际数据,问题解决;

3,现在来了一个更为复杂的需求,界面上有2个或者N++个input输入框,改变input1的数值,input2的数据需要更新+1,input3的数据需要更新+2 .......,依次类推,如果按照mvc的我们需要做的事当input1的数据change的时候,C负责控制M的变化,并且开始控制input2的显示数据+1,input3的显示数据+2;如果要将所有input绑定在一起,既操作input2时input1和input3同样要发生变化,当然也可以简化一下把所有的change事件都绑定给同一个方法,但依然复杂,有时会有更复杂的需求,比如input的数量不定或者某些input框是根据具体操作某单一input才会发生变化,想一想这种情况就能体会到代码的复杂;

岔开一个话题,之前了解了下量子纠缠,量子与量子之间通过虫洞产生了纠缠,可能他们隔着几亿光年的距离,但是只需要观察其中一个量子的变化既能确定另外一个量子的状态;同理能不能构建一个V与V之间的虫洞——

MVVM,应该这么读:M,V,VM

VM既viewmodel,让V与M之间产生联系,称之为双向绑定,既V变化M对应变化,M变化同时也造成V变化;

示例3中存在的问题能得到很好的解决,既Input1,2,3.....我们都绑定同一个model数据,并且写好V的显示规则如 m+1,m+2;这样当任意input发送操作变化时,都去改变M的数据,这个时候VM负责将M产生的变化对应给其他input(既V),这样子所有的V都被纠缠在了一起;

以上则是我对MVC和MVVM的理解,也需更多的思考应该都在实际开发中遇到的问题来讨论和解决的,不知道这些理解能否给大家带来帮助

viewmodel

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,686评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,668评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,160评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,736评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,847评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,043评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,129评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,872评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,318评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,645评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,777评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,470评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,126评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,861评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,095评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,589评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,687评论 2 351

推荐阅读更多精彩内容

  • SSY说: 原来我一直做的是MVP呀 2015年2月 1日 11:57|#|引用 Simba说: 很好。写的不错。...
    程序员之路阅读 3,870评论 4 7
  • 前言 看了下上篇博客的发表时间到这篇博客,竟然过了11个月,罪过,罪过。这一年时间也是够折腾的,年初离职跳槽到鹅厂...
    西木柚子阅读 21,226评论 12 184
  • 今日体验,今天外地一朋友询问法拉利488保养一次多少钱,当是脑袋有点晕,没有接触过啊,后来通过采购询问的价格,心理...
    王海博阅读 154评论 0 0
  • 娃的爸去出差了,难得天气好,周末两日和他姥姥姥爷带娃在外玩了两天。 1 周六上午,带娃去商场转悠加上吃饭。 给娃买...
    做个行动派1981阅读 294评论 0 0
  • API是什么? API中文翻译过来的意思为:应用程序接口。下面谈谈我的理解: 我们把程序想象成一个房子,程序提供的...
    leomei91阅读 697评论 1 0