骨干简介_动力节点Java学院整理

　　

　　

　　

Web应用程序越来越关注于前端,使用客户端脚本与Ajax进行交互。由于JavaScript应用程序越来越复杂,如果没有合适的工具和模式,那么JavaScript代码的高效编写,非重复性和可维护性方面会面临挑战。模型,视图——控制器(MVC)是一个常见模式,可用于服务器端开发以生成有组织以及易维护的代码.MVC支持将数据(比如通常用于Ajax交互的JavaScript对象表示法(JSON)对象)从表示层或从页面的文档对象模型DOM(文档对象模型)中分离出来,也可适用于客户端开发。
　　

　　

骨干(也称为Backbone.js)是由,杰里米·Ashkenas 创建的一个轻量级库,可用于创建MVC类应用程序.Backbone:

　　

　　<李>强制依赖于Underscore.js,下划线。js是一个实用型库李 　　<李>非强制依赖于jQuery/Zepto李 　　<李>根据模型的变更自动更新应用程序的HTML,有助于代码维护李 　　<李>促进客户端模板使用,避免了在JavaScript中嵌入HTML代码李 　　

　　

模型,视图,集合和路由器是主干框架中的主要组件。在骨干中,模型会存储通过RESTful JSON接口从服务器检索到的数据。模型与视图密切关联,负责为特定UI组件渲染HTML并处理元素上触发的事件,这也是视图本身的一部分。
　　

　　

　　

　　

含有大量Ajax交互的应用程序越来越像那些无页面刷新的应用程序。这些应用程序常常试图限制与单个页面的交互。该SPI方法提高了效率和速度,并使整个应用程序变得更灵敏。状态概念代替了页面概念。散列(Hash)片段被用于识别一个特定状态。散列片段,是URL中散列标签(#)后的那部分,是该类应用程序的关键元素。清单1,显示了一个SPI应用程序使用两个不同的散列片段产生的两个不同状态。
　　

　　

　　

　　

http://www.example.com//state1
　　

　　

http://www.example.com//state2
　　

　　

骨干提供一个称为路由器(版本0.5前称之为控制器)的组件来路由客户端状态。路由器可以扩展,Backbone.Router 函数,且包含一个散列映射(routes 属性)将状态与活动关联起来。当应用程序达到相关状态时,会触发一个特定活动。清单2,展示了一个骨干路由器示例。
　　

　　

<强>
　　

　　 　　 　　App.Routers。主要=Backbone.Router.extend ({//散列映射路线 　　路线:{ 　　”:“指数”, 　　“/团队”:“getTeams”, 　　“/团队/国家”:“getTeamsCountry”, 　　“/团队/国家/:名字:“getTeam” 　　“*错误”:“fourOfour” 　　}, 　　 　　指数:函数(){//主页 　　}, 　　 　　getTeams:函数(){//列出所有团队 　　}, 　　getTeamsCountry:函数(国家){//得到特定国家的团队列表 　　}, 　　getTeam:函数(国家名称){//得到一个特定国家的团队和一个特定的名字 　　}, 　　fourOfour:函数(错误){//404页 　　} 　　}); 　　之前 　　 　　

创建的每个状态可以为书签。当URL碰到类似下面情况时,会调用这5个活动(索引、getTeams getTeamsCountry getTeamCountry 和,fourOfour)。
　　

　　

　　<李> http://www.example.com 触发,指数() 　　<李> http://www.example.com//teams 触发,getTeams() 　　<李> http://www.example.com//团队/country1 触发,getTeamsCountry(),传递,country1 作为参数 　　<李> http://www.example.com//团队/country1/team1 触发,getTeamCountry(),传递,country1 和,team1 作为参数 　　<李> http://www.example.com//something 触发,fourOfour(),以作,*,(星号)使用。 　　

　　

要启动骨干,先实例化页面加载的路由器,并通过指令,Backbone.history.start(),方法监视散列片段中的任何变更,如,清单3,所示。

　　

　　

　　 　　 　　$(函数(){ 　　var路由器=new App.Routers.Main (); 　　Backbone.history。开始({pushState:真}); 　　}) 　　 　　

当实例化路由器时,会生成,Backbone.history 对象,它将自动引用,Backbone.history 函数.Backbone.History 负责匹配路由和router 对象中定义的活动.start(),方法触发后,将创建,Backbone.history 的,fragment 属性。它包含散列片段的值。该序列在根据状态次序管理浏览器历史方面十分有用。用户如果想要返回前一状态,单击浏览器的返回按钮。
　　

　　

在,清单3,的示例中,通过一个启用HTML5特性,pushState 的配置调用,开始(),方法。对于那些支持,pushState 的浏览器、支柱将监视popstate事件以触发一个新状态。如果浏览器不能支持HTML5特性,那么,onhashchange 活动会被监视。如果浏览器不支持该事件,轮询技术将监视URL散列片段的任何更改。

骨干简介_动力节点Java学院整理