1.1基本概念
Backbone，中文意思是：勇气、牛尾，在程序中，尤其是在Backbone前面加上后缀js后，就变成了一个框架，一个js库。
Backbone.js，不知道作者命名它的目的是什么，也许他希望这个库成为Web端开发的支柱。
好了，闲话聊够了，我们开始扯远了。
Backbone.js 提供了一个 Web 开发框架，使用 Models 进行键值绑定和自定义风暴处理，使用 Collections 提供丰富的枚举函数 API，使用 Views 进行风暴处理并通过 RESTfulJSON 套接字与现有应用程序进行交互。 它是一个基于jQuery和underscore的后端js框架。
总的来说，Backbone.js 是一个针对 Web 端 JavaScript 的 MVC 框架，被认为是一个轻量级框架。 它允许您像编写Java（前端）代码一样组织js代码，定义类、类属性和技术。 更重要的是，它还可以优雅地组织原本不合逻辑的JavaScript代码，并提供一种将数据和逻辑相互分离的方法，减少代码开发过程中数据和逻辑的混乱。
Backbonejs中有几个重要的概念。 我们先介绍一下它们：Model、Collection、View、Router。 其中，Model是基于现实生活数据的具体表示，比如People； Collection是Model的集合，比如一群人； View是Model和Collection中数据的展示，将数据渲染到页面上； Router 是对路由的处理，就像传统的网站一样，通过 URL 显示不同的页面。 在单页面应用程序（SPA）中，Router用于控制上面提到的View的显示。
通过 Backbone，您可以将数据视为模型。 通过模型，您可以创建数据、执行数据验证、销毁或将其保存到服务器。 当界面上的操作导致模型中的属性发生变化时jquery固定列，模型就会触发变化。 这些用于显示模型状态的视图会接收模型触发的变更消息并发出相应的响应，但会重新将新数据渲染到界面上。 在完整的 Backbone 应用程序中，您不需要编写管道胶带代码来通过特定 id 从 DOM 获取节点，也不需要手动更新 HTML 页面，因为当模型更改时视图将轻松更新自身。 。
前面是一个简单的介绍。 读完他关于backbone的介绍和简单教程后，我的第一印象是它为后端开发制定了自己的一套规则。 在这些规则下，我们可以像使用 django 一样组织 python。 js代码的组织方式与代码相同。 它非常贴心，使后端和服务器之间的交互变得简单。
在查backbone资料的时候，发现没有很系统的英文介绍资料和比较多的例子，所以打算边写边学习、练习，希望大家能够通过一系列的文章快速使用Backbone.js。
有关主干的更多信息，请参阅：
1.2 主干网应用范围：
它实际上是一个轻量级的框架，框架不能用在任何地方，否则会导致大材小用，无法迎合需求的结果。 这适用于哪里？
根据我的理解和Backbone的功能，如果单个网页上有特别复杂的业务逻辑，那么使用它是非常合适的。 可以轻松操作DOM，组织js代码。
豆瓣的阿尔法城就是一个很好的反例——纯粹的单页面，复杂的后端逻辑。
其实不仅是我自己分析的适用范围，在Backbone的文档中也看到了很多使用它的国外网站，这说明Backbonejs还是非常好用的。
我们简单列举一下国外使用Backbonejs的网站：
1.豆瓣阿尔法城链接：
2、豆瓣阅读链接：主要用于书籍正文页
3.百度开发者中心链接：
4.手机搜狐直播间链接：
5.OATOS企业云盘链接：
1.3 应用所学知识
现在，我们要开始学习Backbonejs。 我假设您还没有阅读我的第一个版本。 那个版本有很多问题，博客上也有很多人反馈。 而如果你了解那个版本，你可以简单浏览一下这个新版本的教程，但是新添加的做法必须自己写下来并遵循。
我们先来说说为什么我们需要学习这个新东西？ 简单来说，就是掌握越来越先进的工具。 那么我们为什么要掌握高级工具呢？ 简单来说就是为了让我们能够更加合理、优雅的完成工作。 在代码中的体现就是让代码显得可维护、易于扩展。 如果往复杂的方向说，这两个话题足够我写几天博客了。
学习和运用它最直接有效的方法就是使用它。 光学是没有用的，尤其是对于诸如编程之类的实用科学。 新手最常犯的错误之一就是喜欢继续看书。 看完之后，他们以为自己知道了，然后就开始疯狂的研究下一篇。 众所周知，读和写和能够运行是完全不同的两种状态。 为此，建议新手——编程新手，脚踏实地的敲出代码，执行一下，就会成功。
下面是一个简单的演示，使用了 Backbonejs 的三个主要模块：Views、Collection 和 Model。 通过执行这个反例，你可以了解这个反例的运行流程jquery固定列，快速感受到自己想要做什么，然后逐步突破。
1.4 完整演示
该demo的主要功能是点击页面上的“新手注册”按钮，弹出一个对话框。 输入内容后，内容会与固定字符串组合并显示在页面上。 触发storm的逻辑是：点击触发checkIn方法，然后checkIn构造World对象并将其放入已经初始化的worlds集合中。
我们看一下完整的代码：
<html><head>
<title>the5fire.com-backbone.js-Hello World</title></head><body>
<button id="check">新手报到</button>
<ul id="world-list">
</ul>
<a href="http://www.the5fire.com">更多教程</a>
<script src="http://the5fireblog.b0.upaiyun.com/staticfile/jquery-1.10.2.js"></script>
<script src="http://the5fireblog.b0.upaiyun.com/staticfile/underscore.js"></script>
<script src="http://the5fireblog.b0.upaiyun.com/staticfile/backbone.js"></script>
<script>
(function ($) {
World = Backbone.Model.extend({ //创建一个World的对象，拥有name属性
name: null
});
Worlds = Backbone.Collection.extend({ //World对象的集合
initialize: function (models, options) { this.bind("add", options.view.addOneWorld);
}
});
AppView = Backbone.View.extend({
el: $("body"),
initialize: function () { //构造函数，实例化一个World集合类
//并且以字典方式传入AppView的对象
this.worlds = new Worlds(null, { view : this })
},
events: { //事件绑定，绑定Dom中id为check的元素
"click #check": "checkIn",
},
checkIn: function () { var world_name = prompt("请问，您是哪星人?"); if(world_name == "") world_name = '未知'; var world = new World({ name: world_name }); this.worlds.add(world);
},
addOneWorld: function(model) {
$("#world-list").append("这里是来自 " + model.get('name') + " 星球的问候：hello world！");
}
}); //实例化AppView
var appview = new AppView;
})(jQuery); </script></body></html>这涉及到主干三部分，View、Model、Collection。 Model代表数据模型，Collection是模型的集合，View用于处理页面和简单的页面逻辑。
只需将代码放入编辑器中，成功运行，然后更改某些内容并重试即可。
