《开始学Backbone.js》之第三章Backbone Models与Collections（一）

本篇内容翻译自《Beginning Backbone.js》，原著作者James Sugrue。转载请注明相关信息。

 

       Backbone.js应用的模型层由两个主要的部分组成：数据呈现（Backbone.Model）和由数据组成的集合（Backbone.Collections）。正确掌握这两部分如何工作以及交互，能让你的Backbone应用具有结构良好的数据层。

 

    系统设置

       在开始之前，为了确保你的系统能够正确运行你还需要做几件事情。首先，你的所有代码应该放在一个Apache web服务器中运行，而不是简单地从文件系统中运行。在我的例子中，我将一个名字为backbone的文件夹放在了安装的XAMPP的htdocs目录下。当要访问这个服务器的index.html页面时，可以通过这个URL访问：http://localhost/backbone/index.html。

 

        index.html页面的结构可以参照前面几个章节的例子。确保在该文件中引用了Backbone，Underscore和jQuery库，且把本章出现的所有其它JavaScript代码放在文件结尾的script标签里面。

        

        你将注意到，在后台API调用中，我使用的是Node.js。其可以从http://nodejs.org下载，且在设置server.js文件（将在”与服务器交换数据“部分创建的）前，你应确保你本地的安装能够正确地运行。

 

        最后，当你遇到问题时不要忘了使用Chrome开发者工具，它总是能提供了一些好的方式来定位JavaScript代码的bug。

 

    Backbone Models

        每一个应用都以模型的定义开始。在应用中需要处理和呈现的正是数据。正如前面几章所描述的，模型就是数据所在层且常常包含很多对象。一般来说，应该将问题分解成几个单独的元素然后将它们描述成模型对象。

 

       在Backbone中创建模型对象，需要使用Backbone.Model。后面你将发现所有你创建的Backbone对象都将使用.extend方法来创建自定义的类，如下面这段代码：

MyModel = Backbone.Model.extend({
    //这里定义对象属性
})

 

       Backbone库中的所有对象都以Backbone为命名空间，这样就非常地清晰什么时候使用的是Backbone中的对象。

 

       在实际的应用中，可能不会这样创建一个模型，而是通过传入一些属性值来正确地构建对象。在前面那个代码片段中，空的大括号（{}）表示的是对象字面量。模型的所有属性和方法都在这里面。

 

       提示：对象字面量包含一系列以key: value的形式组成且由逗号分割的键值对，其中value可以是函数也可以是其他对象。

 

    构造函数

       当创建新的模型对象时，在构建过程中可能需要执行一些操作，比如设置不同的处理函数或者设置一些初始状态。在Backbone中实现这些，只需在创建模型对象时定义一个initialize函数。

 

       为了看看实战中的initialize函数我们可以创建一个简单的Book对象，其作用是在对象创建是向控制台输出一行信息。

Book = Backbone.Model.extend({
    initialize: function(){
         console.log('a new book');
    }
};

 

       当创建一个Model对象的新实例时这个initialize函数就会立即执行。在这个例子中，当创建一个新的Book对象时，在控制台中我们会看到一行”a new book"的内容。

var myBook = new Book();

 

       模型的另一种常见需求是为其设置一些默认属性。这样做可以定义一些可选参数，而不是在对象创建传入参数。在Backbone中，可以通过使用defaults对象字面量来实现。

Book = Backbone.Model.extend({
    initialize: function(){
        console.log('a new book');
    },
    defaults: {
        name: 'Book Title',
        author: 'No one'
    }
});

 

       这样在创建对象时，这些默认的值可以提供给各个实例。