创建集合
集合就是用来存储和管理一系列相同类型的模型，相同类型，指的是它们有相同的字段。模型和集合的结合有多种方式，需要多想想
- 创建集合
// 模型
var Book = Backbone.Model.extend({
defaults: {
name: ''
}
});
// 集合
var BookList = Backbone.Collection.extend({
model: Book
});
// 创建一系列模型对象
var book1 = new Book({
name: 'Effective Java'
});
var book2 = new Book({
name: 'java and javascript'
});
// 创建集合对象
// 参数是数组，不是对象
var books = new BookList([book1,book2]);
- 模型对象有
clone方法。和上面的方式，大同小异
// 模型
var Book = Backbone.Model.extend({
defaults: {
name: ''
}
});
// 集合
var BookList = Backbone.Collection.extend({
model: Book
});
// 使用另一种方式创建模型对象而已
var book1 = new Book({
name : 'Effective Java中文版(第2版)'
});
var book2 = book1.clone();
book2.set('name', 'JAVA核心技术卷II：高级特性（原书第8版）');
// 创建集合对象
var books = new BookList([book1,book2]);
- 利用 数据 和 模型类 创建集合对象。较为不同,当你使用 Collection 只是为了管理数据，不需要扩展其他自定义方法，使用这种创建方式即可。这中方式在项目中最常用。
// 创建 模型类
var Books = Backbone.Model.extend({
dafaults: {
name: ''
}
});
// 定义数据
var models = [
{name:'java'},
{name:'javascript'}
]
// 利用 数据 和 模型类 创建集合对象
var books = new Backbone.Collection(models,{
model: Book
});
补充：id 和 cid
- id是前端为每个模型设置的，没有设置则没有
- cid是所有model创建时自动生成的唯一标识符
向集合中添加模型
集合操作中，第二个参数的
at项会覆盖方法原本的位置
- add()，可以添加一个模型或者一个模型数组
- push()，尾部添加
- unshift()，头部添加
- 当模型对象被添加到集合中，会触发集合的
add事件。除非设置了silent配置项。
// 创建集合对象
var books = new BookList(models,{
model: Book
})
// 集合对象使用以上方法
books.add({
name: '构建高性能的web网站'
});
books.push({
name : 'Web富应用开发',
}, {
at : 1
});
删除模型
- remove，删除一个模型或一个模型数组
- pop，删除尾部一个模型并返回
- shift，删除头部一个模型并返回
- 删除模型后，会触发集合的
remove事件。除非设置了silent配置项。
books.remove(books.models[2]);
books.pop();
books.shift();
集合中查找模型
- 四种不同的查找方式
-
where这种查找方式，数据可以是模型对象的一部分或全部。结果是一个数组。
// get，通过id查找模型对象
var book1 = books.get(1001);
// geiByCid, 通过cid查找模型对象
var book2 = books.getByCid('c1');
// at, 查找对应下标的模型对象
var book3 = books.at(0);
// where, 根据数据查找模型对象数组
var bookArr = books.where({
name: 'java'
});
自动排序
自动排序在模型对象较多的时候，消耗较大。比如，每次插入，为了保持数据排序，都会调用。同时，插入方法指定的位置不起作用。因此，此时可以使用sort排序。
// 在创建集合对象的时候，同时添加上`comparator`选项，该选项定义排序规则，使用方式和sort一样
var BookList = Backbone.Collection.extend({
model: Book,
comparator: function (m1,m2) {
var price1 = m1.get('price');
var price2 = m2.get('price');
if(price1 > price2) {
return 1;
} else {
return 0;
}
}
});
从服务器获取数据
有两个与服务器进行交互的方法
// 从服务器中拉取数据
books.fetch({
add: true,
success: function(collection, resp) {
// 同步成功后在控制台输出集合中的模型列表
console.dir(collection.models);
}
});
// 创建一个模型
books.create({
name : 'Thinking in Java',
price : 395.70
}, {
success : function(model, resp) {
// 添加成功后, 在控制台输出集合中的模型列表
console.dir(books.models);
}
});
- 拉取数据会覆盖原来的集合上的模型，因此，如果想要不覆盖，需要添加
add:true的配置.同时fetch之后会触发集合的reset事件，还有request,sync/error - 创建模型的时候，会先将创建的对象添加到集合中，再提交到服务器。可以通过配置
wait，来控制只有在服务器返回200状态码的时候，才将模型对象添加到集合中。会触发集合的add事件,还有request,sync/error
数据批量同步到服务器
当
collection拿到数据之后，还需要手动的添加到各个模型中
- 在博客中，提供了一个方法，在
reset事件中进行批量同步 - 在项目中，使用
sync等事件进行同步
