JSMVC简介
浏览数：18 /
时间：2015年06月09日
JSMVC的现状
15 年前，许多人都使用
Perl 和 ColdFusion
之类的工具构建网站。我们经常编写可以在页面顶部查询数据库的脚本，对数据应用必要的转换，以及在同一个脚本底部显示数据。这类架构适合于向网站添加简单的
“Contact us” 表单。然而，随着应用程序变得更加复杂，这种方法无法进行相应的扩展来处理更大的复杂问题。大部分 Web
应用程序现在已经对模型-视图-控制器 (MVC) 架构进行了标准化，使用单独的代码实现业务逻辑、显示逻辑和用户交互（路由）逻辑。涌现出从 Spring MVC
到 Rails 的各种框架可以帮助您快速实现基于 MVC 的 Web 应用程序。
几年前，jQuery 是用于构建客户端 JavaScript 应用程序的主流库。然而，随着应用程序中的 JavaScript
的复杂性日益增加，jQuery 成为一项处理复杂性的必要不充分技术。例如，用于待办事项 (to-do)
列表的单页面应用程序可以包含一个紧急待办事项列表、一个完整的待办事项列表、一个当日待办事项列表，以及一个过期待办事项列表。在删除某个待办事项时会怎样？如果任务很紧急但已过期，您可能需要手动编写代码来从视图中的三个或四个不同位置中删除该事项。如果删除某个对象后需要您删除或更改屏幕上显示的其他相关对象，这样复杂性就会变得无法控制。
客户端 MVC 框架旨在解决此类问题，并且大多数框架都表现出色。目前较流行的JavaScript 客户端 MVC
框架有AngularJS，Backbone.js，Spine.js，Knockout， Batman.js。
JavaScript 客户端 MVC 框架仍然不够成熟。这个领域正在发生快速改变，缺少一致认可的最佳实践。对于较大的项目
AngularJS，Backbone.js 和 Spine.js 都是非常流行、具有良好支持的。如果倾向于声明视图绑定，那么 Knockout.js 和
Batman.js 则都是不错的选择。
JSMVC客户端MVC框架
JSMVC是一种客户端MVC，是一套开放源代码的多样化互联网应用程式框架，以
jQuery 与 OpenAJAX 为基础。JavaScriptMVC 利用 MVC 架构与工具扩展这些函式库，以便开发与测试。由于 JavaScriptMVC
不需要任何服务器端的配合，因此它可以和任何的网站服务接口与编程语言整合，如 ASP.NET、Java、Perl、PHP、Python 或 Ruby。
JSMVC是随ajax技术的应用慢慢演进出来的。是创建JSMVC架构应用程序的一系列实践和工具。
在Ajax 下的request/response步骤:
首先，js 从dom中提取数据，并将dom中的数据转化为json传递到后台。
其次，后台接收json，将json映射为后台对象，并根据相关的数据执行相关逻辑 ，执行完成后，将处理后的数据转化为json响应到前台。
最后，前台js 获取响应的json数据，并更新到前台dom中。
在 post json 和 response json 中， json格式数据即是js对象。从这里就衍生出Model。
Model 改变刷新 View， View有用户输入改变Model. 这种方式就是典型的 M-V模型，M-V模型的缺点是Model 和
View的耦合性很高，复用度不够。 此时引入Controller控制Model - View 之间的交互。
客户端MVC(JSMVC)的流程如下：
1). 客户端根据用户的行为修改客户端Model
2). 客户端更新和该Model相关的View
3). 客户端Model发送sync请求到服务器，只包含改变了哪些数据
4). 服务器审核数据改动是否合法，只需回复是否修改成功
5). 客户端收到成功，什么都不用做；不成功，则把刚才改的View改回来，然后通知用户。（当然，也可以在客户端的Model里面也加入审核机制，这样对不合法数据的反应更快，但还是得保留服务器端的审核）
JSMVC职责划分
1) Model 模型层
业务模型：业务逻辑、流程、状态、规则
（核心）数据模型：业务数据、数据校验、增删改查（AJAX）
2）View 视图层
（核心）视图：定义、管理、配置
模板：定义、配置、管理
组件：定义、配置、管理
（核心）用户事件配置、管理
用户输入校验、配置、管理
3. C 控制器/分发器
（核心）事件分发、模型分发、视图分发
不做数据处理、业务处理，即业务无关
扩展：权限控制、异常处理等
C是JSMVC框架的核心，实现集中式配置和管理，可以有多个控制器
4. 工具库
主要是异步请求、DOM操作，可以依赖于jQuery等
JSMVC的优势
JSMVC是一款代码简易而功能强大的面向对象（oo）Javascript
mvc框架（简称jsmvc），也是作者在工作过程中的经验总结，实用性强；通过它，能够简化Javascript代码开发，代码模块化重复使用以及模块代码分享,单一入口mvc模式，有自己的doc元素操作和查询方法，不依赖jquery。现在将jsmvc功能特征概括如下:
1） jsmvc采用只引入一个js文件到html页面的单一入口
2） css、js自动按需装载
3） 可以自动预载其他js框架
4） 用户只要按命名规范编写类，放到相应目录，即可使用
5） 集成扩展常用函数
6） 支持类的声明与继承，简易Ajax
7） 简约而快速的CSS选择器
8） 产品上线可以启开css、js智能请求合并一为单一请求
在js下，MVC其实就是：把html代码、CSS、js分离开来。html是模型层、css是视图，js写成一个一个的类。类与html之间尽量不要强耦合。不要在类体内使用document.getElementById(或$(‘#xxx‘))某个具体的元素，应当把要使用的元素作为一个参数写入。这样,代码就独立起来了,就很好维护。
比较一下可以看到，前端MVC需要向服务器端传递和接收的数据量都少很多，而前端要做的等待和渲染工作也少了很多。换言之，会提供更快的交互反馈，也意味着更好的用户体验。同时，服务器端的负载也略有降低。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
