js中的MVC

JavaScript019

js中的MVC,第1张

(本文仅供本人记录,并非自主内容产出,如有错误,欢迎纠正!)

MVC定义: MVC是一种架构模式,可以抽象成三个部分:M 模型、V 视图、C 控制器。

一个事件发生的过程(通信单向流动):

js传统开发模式中,大多基于事件驱动:

故js中的MVC 特点 是: 单向流动、事件驱动

一)模型

模型存放着应用的所有数据对象(业务数据、数据校验、增删查改)

数据是 面向对象 的,控制器请求模型读写数据时,模型就将数据包装成模型实例。任何定义在这个数据模型上的函数或逻辑都可以直接被调用。

模型在MVC设计思想中与视图应是解耦的。

二)视图

视图是呈现给用户的,在MVC思想中主要体现的是:视图以 观察者模式 监视模型,以获取最新的数据。故页面首次加载时,是从接收模型的数据开始。

三)控制器

控制器是模型与视图间的桥梁,集中式地配置和管理事件分发、模型分发、视图分发、权限控制和异常处理等。

页面加载完成后,控制器会监听视图的用户交互,一旦发生交互,控制器做出对视图的选择,触发控制器的事件处理机制,去派发新的事件,通知模型更新数据。

优点: 耦合性低、重用性高、生命周期成本低、部署快、可维护性高、有利软件工程化管理

缺点:

没有明确的定义 (MVC模型需要精巧的设计,对中小型项目并不友好,因视图与模型有强制分离的需求,故调试时也比较麻烦)

增加系统结构和实现的复杂性 (过多的更新操作,严格地按照MVC分离反倒会使运行效率降低)

视图与控制器间的过于紧密的连接 (视图需要与控制器配合使用,这就导致了独立重用的难度)

一般高级的界面工具或构造器不支持模式

要加快网页的加载速度,其实有很多方法。减少包含js也是一种优化手段。

至于MVC只是一种思考的模式,并不具有加载js的方法。

据我所知,可以借助smarty3来实现减少包含js。

理论指导是使用组合的方式,也就是高内聚,低耦合。

举个例子

在A页面需要用到example.js里面的的方法,那么我可以在A页面这样写

<{include file="example.tpl"}>

然后在example.tpl里面加入

<script src="<{$jsUrl}>example.js" type="text/javascript"></script>

尝试了还是不行的原因,你可能在mvc的xml文件中没有引入mvc的配置:

(我的是这个文件:applicationContext-mvc.xml)

1、xmlns:mvc="http://www.springframework.org/schema/mvc"

2、xsi:schemaLocation=“http://www.springframework.org/schema/mvc 

http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd”

3、<mvc:annotation-driven /><!--启动注解驱动 -->

<mvc:resources location="/imgages/" mapping="/imgages/**"/>

<mvc:resources location="/js/" mapping="/js/**"/>

<mvc:resources location="/css/" mapping="/css/**"/>

如此之后,我的就可以了。希望让更多的的人看到

PS:我的项目是Maven构建的Spring+SpringMVC+MyBatis

贴上图片,看的更直观些