介绍
Backbone.js 是一个面向 Model-View-Controller（MVC）设计模式的 JavaScript 库，用于构建单页应用程序。它提供了一些基本组件，如模型、视图、集合和路由器，可使开发人员可以更轻松地管理应用程序中的数据和用户界面。
在本文中，我们将深入学习 Backbone.js，包括如何安装和配置它以及如何使用它的核心组件来创建单页应用程序。
安装
要安装 Backbone.js，请先确保您已经安装了 Node.js 和 npm。然后运行以下命令：
npm install backbone
这将自动安装 Backbone.js 及其所有依赖项。
配置
在您的 HTML 文件中添加以下代码，您将需要引入 Backbone.js 和其依赖项：
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.13.1/underscore-min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.4.1/backbone-min.js"></script>
核心组件
模型（Model）
模型是 Backone.js 中最重要的组件之一。它们代表了应用程序中的数据，并提供了许多便捷方法来获取、设置和操作数据。
以下是一个简单的模型示例：
const Book = Backbone.Model.extend({
defaults: {
title: '',
author: '',
year: '',
},
});在这个示例中，我们定义了一个名为 Book 的模型，并设置了其默认属性。要创建该模型的实例，请使用以下代码：
const book = new Book({
title: 'The Great Gatsby',
author: 'F. Scott Fitzgerald',
year: 1925,
});视图（View）
视图是用户界面的组成部分。它们显示数据并响应用户输入。
以下是一个简单的视图示例：
-- -------------------- ---- -------
----- -------- - ----------------------
--- --------
------------ -
--------------
--
-------- -
---------------
-----------------------------------
---------- -------------------------------
-------- -----------------------------
---
-
---
----- -------- - --- ---------- ------ ---- ---在这个示例中，我们定义了一个名为 BookView 的视图，并指定了该视图将呈现到 HTML 元素 #book 中。我们还定义了视图的初始化函数和呈现函数。
集合（Collection）
集合是一组具有相同类型的模型的容器。它们提供了许多便捷方法来获取、添加、删除和排序模型。
以下是一个简单的集合示例：
-- -------------------- ---- -------
----- -------------- - ----------------------------
------ -----
---
----- ----- - --- ----------------
-
------ ---- ----- --------
------- --- ----- ------------
----- -----
--
-
------ --- ---- - -------------
------- ------- -----
----- -----
--
---
-----------
------ -------
------- ------- --------
----- -----
---在这个示例中，我们定义了一个名为 BookCollection 的集合，并指定了该集合应包含的模型类型。我们还定义了集合的初始数据，并添加了一个新模型。
路由器（Router）
路由器是一个管理 URL 和应用程序状态之间映射的组件。它们提供了一种将 URL 中的参数与应用程序中的操作相匹配的方式。
以下是一个简单的路由器示例：
-- -------------------- ---- -------
----- --------- - ------------------------
------- -
--- -------
----------- --------------
--
------ -
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------