前端MVC:(model、view、controller)模型、视图、控制器

MVC的逻辑都应该以函数的形式包装好,然后按产品业务和交互需求,使用对应的设计模式组装成合适的MVC对象或类。

MVC逻辑划分的清晰度判断标准是维护人员要能明确的区别哪些是M层的函数,哪些是V层的函数,哪些是C层的函数,其调用的次序通常是从C到M到C到V,参数从M层输入计算后得到返回值传递给C层,C层依据M层传来的参数操作完毕后,将结果呈现在V层。这样做的好处是:当维护人员在维护和修改产品的时候,可以根据V层的异常结果去追踪对应C层的参数、逻辑和输出,如果对应的C层没问题,就再追踪M层,直至追踪至服务端。

清晰划分前端MVC的好处在于可以将前端逻辑的关联关系划分开,将复杂问题分解成一个个相关联的简单问题去逐一分析解决,从而将问题的复杂度限制在人脑可以处理的范围内逐一解决,避免问题的复杂度(繁杂的数据和关联关系)超出人脑的处理能力。

M:模型层,主要包括数据模型的创建()、添加、修改(拼接、格式化等)、删除、查询(清洗、过滤等)等操作逻辑;

C:控制器层,主要包括两个方面:
1、注册事件并操作DOM,获取用户的输入和操作参数,将参数传递给模型层处理;
2、根据模型层返回的参数进行DOM操作,控制视图来呈现不同的状态用以与用户交互;

V:视图层,主要包括HTML标签、CSS,提供给控制器操作的对象;

MVC程序结构划分只适合使用在那些业务逻辑较为复杂的项目中,太过简单的业务和交互逻辑也划分MVC,就像拿高科技制导导弹去打蚊子,得不偿失。

我对前端MVC的理解的更多相关文章

  1. 【blade的UI设计】理解前端MVC与分层思想

    前言 最近校招要来了,很多大三的同学一定按捺不住心中的焦躁,其中有期待也有彷徨,或许更多的是些许担忧,最近在开始疯狂的复习了吧 这里小钗有几点建议给各位: ① 不要看得太重,关心则乱,太紧张反而表现不 ...

  2. 前端MVC框架Backbone 1.1.0源码分析(一)

    前言 如何定义库与框架 前端的辅助工具太多太多了,那么我们是如何定义库与框架? jQuery是目前用的最广的库了,但是整体来讲jQuery目的性很也明确针对“DOM操作”,当然自己写一个原生态方法也能 ...

  3. 我的前端MVC之路

    大约十几个月前,了解到时下前端MVC之火爆,同事推荐我了解一下angular.当时也不是特别在意,只是稍稍阅读了一遍官方文档,并尝试了文档上的例子.其实当时也颇有震惊之感的,原来代码还可以这么写!看完 ...

  4. 侃侃前端MVC设计模式

    前言 前端的MVC,近几年一直很火,大家也都纷纷讨论着,于是乎,抽空总结一下这个知识点.看了些文章,结合实践略作总结并发表一下自己的看法. 最初接触MVC是后端Java的MVC架构,用一张图来表示之— ...

  5. 前端mvc mvp mvvm 架构介绍(vue重构项目一)

    首先 我们为什么重构这个项目 1:我们现有的技术是前后台不分离,页面上采用esayUI+jq构成的单页面,每个所谓的单页面都是从后台胜场的唯一Id 与前端绑定,即使你找到了那个页面元素,也找不到所在的 ...

  6. 【Java面试】说说你对Spring MVC的理解

    一个工作了7年的粉丝,他说在面试之前,Spring这块的内容准备得很充分. 而且各种面试题也刷了,结果在面试的时候,面试官问:"说说你对Spring MVC的理解". 这个问题一下 ...

  7. 前端MVC学习总结(一)——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

  8. 前端MVC学习总结——AngularJS验证、过滤器

    前端MVC学习总结--AngularJS验证.过滤器 目录 一.验证 二.过滤器 2.1.内置过滤器 2.1.1.在模板中使用过滤器 2.1.2.在脚本中调用过滤函数 2.2.自定义过滤器 三.指令( ...

  9. 前端MVC框架、类库、UI框架选择

    CSS预处理器sass(基于Ruby服务端版)less(客户端版:基于js; 服务端版:基于nodejs) 前端UI框架JqueryMiniUI: http://www.miniui.com/(适用于 ...

随机推荐

  1. 编写优秀jQuery插件的10个技巧

    前言:在开发过很多 jQuery 插件以后,我慢慢的摸索出了一套开发jQuery插件比较标准的结构和模式.这样我就可以 copy & paste 大部分的代码结构,只要专注最主要的逻辑代码就行 ...

  2. 搬寝室(HDU 1421 DP)

    搬寝室 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submiss ...

  3. 在UC浏览器上很炫的一个效果

    效果简述: 这个效果将会强行去除UC浏览器的网址输入框和底部的菜单栏,这样网页将会占据整个手机界面.感觉看起来很像是一个APP. 浏览器界面右下角将会出现一个向上的标志,用来唤出简单的菜单栏. (界面 ...

  4. Qt读取ANSI格式文件——利用QTextCodec将其他编码格式转换为Unicode格式

    Qt使用Unicode来表示字符串.但是通常需要访问一些非Unicode格式的字符串,例如打开一个GBK编码的中文文本文件,甚至一些非Unicode编码的日文,俄文等. Qt提供了QTextCodec ...

  5. 【转】ubuntu下安装及设置FTP服务器!!

    原文网址:http://hujizhou.blog.51cto.com/514907/1290915 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律 ...

  6. hihoCoder 1041 国庆出游 (DFS)

    题意: 小Hi和小Ho准备国庆期间去A国旅游.A国的城际交通比较有特色:它共有n座城市(编号1-n):城市之间恰好有n-1条公路相连,形成一个树形公路网.小Hi计划从A国首都(1号城市)出发,自驾遍历 ...

  7. OpenStackCLI调试及术语识记

    1,Project are organizational units in the cloud,and are also known as tenants or accounts.Each user ...

  8. 【转】Android中自动连接到指定SSID的Wi-Fi

    最近在做一个项目,其中涉及到一块“自动连接已存在的wifi热点”的功能,在网上查阅了大量资料,五花八门,但其中一些说的很简单,即不能实现傻瓜式的拿来就用,有些说的很详细,但其中不乏些许错误造成功能无法 ...

  9. Java配置文件Properties的读取、写入与更新操作

    /** * 实现对Java配置文件Properties的读取.写入与更新操作 */ package test; import java.io.BufferedInputStream; import j ...

  10. .NET 中使用 HttpWebResponse 时 Cookie 的读取

    今天把一个网站登录配置到以前写的蜘蛛程序中,发现不能成功登录.检查后才发现,那个网站在登录成功后,输出了一个特殊路径的 Cookie,由于是使用 HttpWebRequest.Cookies 来获取的 ...