Backbone(1.1.2) API 中文文档

最新推荐文章于 2025-06-08 09:01:33 发布

翻译最新推荐文章于 2025-06-08 09:01:33 发布 · 2.5k 阅读

网站开发专栏收录该内容

29 篇文章

订阅专栏

Backbone.js是一款轻量级的JavaScript库，提供了模型、集合和视图等结构，用于构建复杂的Web应用程序。它支持通过RESTful JSON接口与服务器交互，利用自定义事件处理UI更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

网址：http://backbonejs.org/

翻译：栩

日期：2014.4.16

原因：网上流传的中文文档的版本是0.5，比较旧了，新版本有很多更新

英文水平：差

状态：更新中

Backbone为复杂Javascript应用程序提供模型(models)、集合(collections)、视图(views)的结构。其中模型用于绑定键值数据和自定义事件；集合附有可枚举函数的丰富API；视图可以声明事件处理函数，并通过RESRful JSON接口连接到应用程序。

（GitHub介绍略）

下载和依赖

（下载略，请前往官网）

Backbone唯一重度依赖Underscore.js(>=1.50)。基于RESTful（一个架构样式的网络系统）的约束，histroy的支持依赖于Backbone.Router ，DOM处理依赖于 Backbone.View，包括jquery，json2.js对旧的IE浏览器的支持。（模仿Underscore 和 jQuery 的APIs，例如 Lo-Dash 和 Zepto，在不同的兼容性下也一样能运行）

介绍

当我们开发含有大量Javascript的web应用程序时，首先你需要做的事情之一便是停止向DOM对象附加数据。通过复杂多变的jQuery选择符和回调函数创建Javascript应用程序，包括在HTML UI，Javascript逻辑和数据之间保持同步，都不复杂。但对富客户端应用来说，良好的架构通常是有很多益处的。

通过Backbone，你可以将数据呈现为模型, 你可以对模型进行创建，验证和销毁，以及将它保存到服务器。任何时候只要UI事件引起模型内的属性变化，模型会触发"change"事件；所有显示模型数据的视图会接收到该事件的通知，继而视图重新渲染。你无需查找DOM来搜索指定id的元素去手动更新HTML。 — 当模型改变了，视图便会自动变化。

某种意义上说，在用javaScript来创建web项目时，Backbone尝试定义一组最小而高效的集合，包括了数据结构（models 和 collections）和用户接口（views 和 URLS）。在web开发环境里，到处都是框架（帮你写好了一切），不过这些库需要你的网站在构建的时候符合该框架的样子，风格，默认的行为。但是，Backbone还是作为一个工具，让你可以随心所欲的设计你的网站。

如果你不懂Backbone或者不确定Backbone能否帮助到你，先运行一下一些Backbone的例子。

文档下面有大量可以运行的例子，请点击 play 运行。

版本更新

内容略

Backbone . Events 事件

Events是一个模块，可以加入任何对象，能够让对象绑定或者触发自定义事件。Events在绑定之前可以不用声明，另外也可以携带参数。例子：

var object = {};

_.extend(object, Backbone.Events);

object.on("alert", function(msg) {
  alert("Triggered " + msg);
});

object.trigger("alert", "an event");

你可以定义一个事件调度程序，然后在你不同的应用模块中调用，例如：

var dispatcher = _.clone(Backbone.Events)

on

函数：object.on(event, callback, [context]) 别名：bind

给 object 绑定一个返回函数。只要事件触发，返回函数就会执行。如果你的一个页面含有大量的时间，我们约定俗成地使用冒号来命名："poll:start", 或者"change:selection"。事件也可以通过空格划分为几个事件。

book.on("change:title change:author", ...);

当回调函数被执行时，可以通过第三个可选参数为该函数赋值this：

model.on('change', this.render, this)

当回调函数被绑定为"all"事件时，所有事件的发生都会触发该回调函数，回调函数的第一个参数会传递该事件的名称。例子，通过proxy把所有事件从一个对象传到另一个对象。

proxy.on("all", function(eventName) {
  object.trigger(eventName);
});

可供选择的是，所有的Backbone事件方法也支持事件映射的语法。

book.on({
  "change:title": titleView.update,
  "change:author": authorPane.update,
  "destroy": bookView.remove
});

off

函数：object.off([event], [callback], [context]) 别名：unbind

取消 object 之前绑定的回调函数。如果没有定义context，所有带有context的这个回调函数（指已经定义的callback）会被移除；如果没有定义callback，所有为这个事件（指已经定义的event）定义的回调函数被会移除；如果没有定义event，所有事件的回调函数会被移除。

// Removes just the `onChange` callback.
object.off("change", onChange);

// Removes all "change" callbacks.
object.off("change");

// Removes the `onChange` callback for all events.
object.off(null, onChange);

// Removes all callbacks for `context` for all events.
object.off(null, null, context);

// Removes all callbacks on `object`.
object.off();

请注意使用 model.off()，这个会真的删除所有的事件，包括Backbone内部用来统计的事件。

trigger

函数：object.trigger(event, [*args])

trigger会触发定义的事件或者事件集。trigger并发产生的参数会传递到触发事件的回调函数里。

once

函数：object.once(event, callback, [context])

用法跟on是一样的，区别在于被绑定的回调函数被触发一次就会被移除（只能执行一次）。

Handy for saying "the next time that X happens, do this".（不会翻译）

listenTo

函数： object.listenTo(other, event, callback)

让 object 监听 other 上的一个特殊的事件。ListenTo能够代替 other.on(event, callback, object) 的优势在于：允许 object 跟踪事件的位置，同时可以使用过一次后可以移除所有事件。callback 经常被当做一个 object 。

view.listenTo(model, 'change', view.render);

stopListening

函数： object.stopListening([other], [event], [callback])

让 object 停止监听事件。stopListening如果不带参数可以移除 object 所有已经创建的callback函数；或者删除特定的事件，在参数填入object 、event 或者 callback，都可以分别移除。

view.stopListening();

view.stopListening(model);

listenToOnce

函数： object.listenToOnce(other, event, callback)

用法和 listenTo 是一样的，但是事件触发一次后callback会被移除。

Catalog of Events 默认事件

Backbone . Model 模型

Models是任何Javascript应用的核心，包括交互数据以及大量相关逻辑：转换，验证，属性和访问控。你用特定的方法去继承Backbone.Model，同时Model提供了一套基础的管理函数。