Backbone.js入门与实战指南：构建高效Web应用

需积分: 50 195 浏览量更新于2024-07-24 收藏 748KB PDF 举报

Backbone.js简易教程是一篇由胡阳（the5fire）撰写的深入指南，旨在帮助初学者快速理解和应用这个强大的JavaScript框架。文章始于2012年4月19日，主要涵盖以下几个关键知识点： 1. **初识Backbone.js**：介绍了Backbone.js的基本概念，它虽然名字源自英文的“勇气”和“脊骨”，但在编程领域，特别是作为后缀加上`.js`后，它成为了一个用于构建Web应用的轻量级前端MVC（Model-View-Controller）框架。 2. **Model实例**：讲解了Backbone.Model的基础用法，它是数据模型，负责存储和管理应用程序的数据。 3. **Collection实例**：介绍了Backbone.Collection，它是模型的集合，可以处理一组模型对象，支持常见的数组操作。 4. **Router实例**：展示了如何使用Backbone.Router来定义URL与视图的映射，实现客户端路由。 5. **View实例**：详细解释了Backbone.View的作用，它是界面组件，负责渲染模板并将数据绑定到DOM元素。 6. **Todos示例**：通过一个Todo应用实例，一步步剖析了Backbone在实际项目中的应用，包括模型、集合和视图的交互。 7. **Django开发环境搭建**：介绍了如何将Backbone.js应用到Django项目中，以及前后端分离开发的相关步骤。 8. **实战：Webchat**：通过构建一个实时聊天应用，展示了Backbone.js在复杂应用中的完整流程，包括前端和后端开发。 9. **总结与资源**：文章结尾提供了进一步的学习资源和对Backbone.js的总结，鼓励读者持续学习和实践。这篇教程不仅涵盖了Backbone.js的基本概念和使用，还通过实例演示了如何将它融入实际项目，并且强调了实战的重要性。对于想要入门或提升Backbone.js技能的开发者来说，这是一个非常实用的学习资料。

Blog:http://www.the5fire.net 共享、交流、提高

alert(' 'success );

//model 为获取到的数据

alert( .model get(' 'name ));

},error:function(){

//当返回格式不正确或者是非 json 数据时，会执行此方法

alert(' 'error );

}});

注：上述代码仅仅均为可正常执行的代码，不过关于服务器端的实例在后面会有。

这里还要补充一点，就是关于服务器的异步操作都是通过 Backbone.sync 这个方法来完成的，

调用这个方法的时候会自动的传递一个参数过去，根据参数向服务器端发送对应的请求。比如你

save，backbone 会判断你的这个对象是不是新的，如果是新创建的则参数为 create，如果是已存

在的对象只是进行了改变，那么参数就为 update，如果你调用 fetch 方法，那参数就是 read，如果

是 destory，那么参数就是 delete。也就是所谓的 CRUD (“create”, “read”, “update”, or

“delete”)，而这四种参数对应的请求类型为 POST，GET，PUT，DELETE。你可以在服务器根

据这个 request 类型，来做出相应的 CRUD 操作。

PS：忘了解释关于 url 和 urlRoot 的事情了，如果你设置了 url，那么你的 CRUD

都会发送对应请求到这个 url 上，但是这样又一个问题，就是 delete 请求，发送了请求，但是

却没有发送任何数据，那么你在服务器端就不知道应该删除哪个对象（记录），所以这里又一个

urlRoot 的概念，你设置了 urlRoot 之后，你发送 PUT 和 DELETE 请求的时候，其请求

的 url 地址就是：/baseurl/[model.id]，这样你就可以在服务器端通过对 url 后面值的提

取更新或者删除对应的对象（记录）。

有一个例外需要提醒下：

如果 model 和 collection 一起使用，那么你定义的在 collection 中的 url 将取代

model 所定义的 urlRoot，但是 model 中的 urlRoot 也必须存在。

关于这个 Backbone.sync 以后可能会说到，不过目前先以简单入门为主。

4、backbone 的 collection 实例

作者：胡阳

本文链接:http://www.the5fire.net/4-backbone-collection.html

collection 是 model 对象的一个有序的集合，概念理解起来十分简单，在通过几个例子来看

一下，会觉得更简单。

1、关于 book 和 bookshelf 的例子

剩余71页未读，继续阅读

silvermaple_lzh

粉丝: 0
资源: 4

Backbone.js入门与实战指南：构建高效Web应用

backbone教程

Tutorialspoint Backbone.js 教程

前端框架backbone使用教程.zip

bbtutorialpractice:通过 Backbone 实践教程进行编码

Backbone.js 便签应用简易演示教程

backbone教程.zip

BackBone教程–第8部分：了解Backbone.js事件

Backbone-Tutorials基础教程

Backbone

hello-backbone:骨干教程来自

最新资源