JavaScript 客户端 MVC 框架调查

15 年前，很多人都行使 Perl 和 ColdFusion 之类的器材构建网站。我们常常编写可以在页面顶部查询数据库的剧本，对数据应用须要的转换，以及在统一个剧本底部表现数据。这类架构得当于向网站添加简朴的 “Contact us” 表单。然而，跟着应用措施变得越发伟大，这种要领无法举办响应的扩展来处理赏罚更大的伟大题目。大部门 Web 应用措施此刻已经对模子-视图-节制器 (MVC) 架构举办了尺度化，行使单独的代码实现营业逻辑、表现逻辑和用户交互（路由）逻辑。涌现出从 Spring MVC 到 Rails 的各类框架可以辅佐您快速实现基于 MVC 的 Web 应用措施。

几年前，jQuery 是用于构建客户端 JavaScript 应用措施的主流库。然而，跟着应用措施中的 JavaScript 的伟大性日益增进，jQuery 成为一项处理赏罚伟大性的须要不充实技能。譬喻，用于待服务项 (to-do) 列表的单页面应用措施可以包括一个紧张待服务项列表、一个完备的待服务项列表、一个当日待服务项列表，以及一个过等候服务项列表。在删除某个待服务项时会奈何？假如使命很紧张但已逾期，您也许必要手动编写代码来从视图中的三个或四个差异位置中删除该事项。假如删除某个工具后必要您删除或变动屏幕上表现的其他相干工具，这样伟大性就会变得无法节制。

客户端 MVC 框架旨在办理此类题目，而且大大都框架都示意精彩。可是您怎样从很多 JavaScript 客户端 MVC 框架中选择吻合的框架。本文将从较高的层面扼要先容个中一些最风行的框架。以及怎样针对给定的用例选择吻合的框架。

Backbone.js

在行使率方面，Backbone 是今朝为止最风行的客户端 MVC 框架。它被普及应用于各个开拓社区，Rails 开拓职员对它的回收率一向较高，并呈现了很多广受接待的资源，好比 thoughtbot（一家备受尊敬的 Rails 咨询公司）推出了 Backbone on Rails（拜见 参考资料）。Backbone.js 的上风在于它与具象状态传输 Web 处究竟现了精采的集成。假如您对后端数据行使 RESTful JavaScript Object Notation (JSON) 模子并遵循 Backbone 所祈望的约定（与 Rails 中的约定匹配），那么您不必要编写任何代码就可以将 Backbone 毗连随处事器，从而节减大量的时刻。

在 Backbone 中，应用措施包括荟萃（用户或文章）、模子（单个用户或文章）、视图和路由器。Backbone.js 中的视图长短预定的 (nonprescriptive)，应承您行使本身喜好的 JavaScript 模板或框架。路由器团结了 Rail 气魄威风凛凛的路由器和一个传统的 MVC 节制器，认真得到给定的 URL 并关照框架要运行的代码。清单 1 中的 Backbone.js 路由器代码给出了一个示例。

清单 1. 样例 Backbone.js 路由器代码

var Workspace = Backbone.Router.extend（{

routes： {

“help”： “help”, // #help “search/：query”： “search”, // #search/kiwis “search/：query/p:page”： “search” // #search/kiwis/p7 },

help： function（） {

....

},

search： function（query， page） {

.....

}

}）;

Backbone.js 附带了一个 Underscore.js 副本。Underscore.js 是一组适用器材，可以通过越发成果化的方法简化 JavaScript 的编写，并支持一系列有效的基于荟萃的操纵。它还包罗 Backbone.history，后者可以辅佐您奇妙地处理赏罚页面导航。

Backbone.js 首要上风在于它与处事器的自动集成。假如这样做得当您的用例，那么进修怎样行使 Backbone.js 将是值得的。您可以通过一些框架在一两个小时之内起源把握也许必要花一到两天进修的Backbone.js 基本常识。这很是得当较量大的项目，这类项目至少一连几周的时刻。

Backbone.js 如故算不上一种齐备的办理方案。您也许必要编写相等数目的代码来处理赏罚隐藏的内存泄漏等题目。您还也许必要试验几种要领来查察泛起内容，之后才气找到真正满意需求的要领。

Spine.js

Spine.js 凡是与 Backbone.js 举办较量；它受到 Backbone.js 的影响，并在行使率方面与前者靠近。Spine.js 包括类、模子、节制器和视图，这比 Backbone.js 引入的荟萃越发传同一些。

Spine.js 行使 CoffeeScript（拜见 参考资料）编写，这使它越发简洁且（依我看来）更易于读取源代码。要相识 Spine.js 怎样事变，您必要认识 CoffeeScript。然而，您不必行使 CoffeeScript 构建 Spine.js 应用措施。可是，假如已行使 CoffeeScript 举办了构建，您可以会见 CoffeeScript 特征（如类）。CoffeeScript 行使原型担任而非经典担任，因而无法支持在当地 JavaScript 中的类。CoffeeScript 行使了一些很是尺度的模式，为但愿行使它们的开拓职员提供类。假如行使纯 JavaScript 编写 Spine.js 应用措施，您只需行使 ，后者使您不必要编写 CoffeeScript 代码就可以会见类。

Spine.js 中的模子、节制器和视图都行使类实现，因此可以同时编写类和实例要领。模子认真处理赏罚营业逻辑，属于模块类，您可以扩展并包罗其他模块，从而殽杂重用属性和成果。模子可以自动序列化到 JSON 中，通过仅行使当地存储实现耐久化。可能可以行使 Asynchronous JavaScript + XML (Ajax) 将工具耐久化随处事器中。和 Backbone.js 一样，Spine.js 此刻提供了公道的默认配置，可以通过 Ajax 实现耐久化，可是仍可以在须要时编写本身的特定实现，而且很是简朴。清单 2 展示了来自一个 Spine.js 应用措施中的 CoffeeScript 代码的示例。

清单 2. Spine.js 应用措施中的 CoffeeScript

class Contact extends Spine.Model

@configure “Contact”, “first_name”, “last_name”

@filter: （query） ->

@select （c） ->

c.first_name.indexOf（query） is not -1

fullName: -> ［@first_name， @last_name］.join（‘ ’）

（编辑：河北网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!