1.1 Backbone简介
Backbone是一个非常轻量级的JavaScript库，压缩后的文件仅有16KB，即使加上依赖库Underscore也只有29KB。体积虽然轻量，但功能十分强大，使用该架构，可以打造一个模型（Model）–视图（View）–控制器（Controller）即MVC类结构的应用程序。通过这种结构，能够高效、分门别类地管理Web应用程序中纷乱复杂的JavaScript代码，以及处理单页界面（SPI）中含有大量复杂的AJAX交互请求。
1.1.1 Backbone的MVC结构
Backbone的功能如此强大，主要原因是它提供了一套非常完整的MVC结构的Web开发框架。在这套框架中，数据模型（Model）负责数据原型的创建和各类事件的自定义，并通过key/value形式绑定原型数据；通过数据模型集合（Collection）所提供的API向原型中添加各类数据；最后通过视图控制器（View）绑定页面中元素的内容并处理相应事件，并通过RESTful JSON接口方式与原有应用程序中的数据进行动态交互。其完整结构如图1-1所示。
图1-1 Backbone的MVC结构
1.1.2 特点及适用范围
Backbone是一个非常轻量级的aScript框架，与其他前端框架相比而言，有许多共同点，此外其自身还有许多其他框架备的特点，包含以下几个方面。
1.MVC结构化
这是Backbone最为显著的特点，根据这一特性，开发人员可以很方便地以MVC体系来组织和开发自己的代码，真正做到数据交互、逻辑处理、页面展示的分离；并可以组织分工开发，减少重复开发，提高代码的开发效率和可维护性，而这些对于大型复杂的前端代码开发至关重要。
2.继承特性
在JavaScript代码中，由于没有类的概念，因此，继承是一个比较困难的事情。通过Backbone框架，不仅能以面向对象的方式编写自己的数据、集合、视图模型，而且这些模型都具有可继承性，这使得开发人员可以很方便地重载这些模型和扩展一些自定义的属性和方法。这一特性，使应用的框架更加清晰，更利于后续代码的维护与升级。
3.事件统一管理
在视图模型中，开发者可以通过以下代码对事件进行统一管理。
events: {
'click #btnAdd': 'btnAdd_Click'
}
在上述代码中，“events”为事件声明，在接下来的大括号中，以表达式的方式声明各类元素绑定的事件和事件触发时执行的函数。其中，“click”表示元素绑定的事件名称，“#btnAdd”表示页面中ID号为“btnAdd”的元素，“btnAdd_Click”表示事件触发时所执行的函数名称；如果需要绑定多个元素的事件，可以通过逗号进行隔开。在视图初始化时，会自动将表达式中的事件绑定到对应元素中。在事件被触发时，视图会自动执行事件对应的函数。
4.绑定页面模板
Backbone可以直接调用页面中的HTML模板，这样做有两个好处：一是可以在HTML模板中嵌入JavaScript代码，无须在动态生成HTML元素时拼接字符串，减少页面执行时的出错率；另一个好处可以在视图中管理页面中的模板，即定义多套HTML页面模板，再根据实际需要选择加载和页面的渲染，极大提升了前端开发人员的工作效率。
5.服务端无缝交互
在Backbone内部中，有一整套与服务器数据自动同步的机制，通过这套机制，用户只需要关注客户端的操作，执行完这些操作后的数据将会在模型类中自动同步到服务器中。而这样的交互也是无缝的，即只要在页面中数据有变化，数据就会自动与服务器同步，至于这一套数据的同步原理和过程,将会在后续的章节中进行详细介绍。
提示
Backbone是构建一个MVC类结构的JavaScript库，是一个重量级的类库。为了更好地体现它的优势，笔者建议在构建大型逻辑复杂的单页应用时使用它。由于在Backbone中，各类模块间的依赖性不并不太强，开发人员也可以从源码库中单独抽离出某一个模块类，应用到现有的Web开发当中，也是一个很不错的选择。