BackboneJs入门学习[06]—Collection初探

⭐️ 本文首发自 前端修罗场(点击即可加入)，一个专注 Web 技术、答疑解惑、面试辅导、职业发展的社区。现在加入，即可参与打卡挑战，挑战成功即可获取一次免费的模拟面试机会，进而评估知识点的掌握程度，获得更全面的学习指导意见，不走弯路，不吃亏！

本期，我们继续学习 BackboneJs 的一个新的模块—— Collection 。

1. Collection的概念：

一看到 Collection 这个单词，你一定会想到“集合”，没错，从字面上我们首先能够想出它的意思（其实，在程序中，很多对某个类或是自定义的变量的英文名，都需要能够“望文生义”，一方面更好的理解，另一方面，也提高编程的效率），Collection是Model对象的一个有序集合，可以理解为Model的容器，它将多个Model集中起来，以便对多个Model进行操作！

下面来看一个示例：

var Book=Backbone.Model.extend({
   defaults:{
            title:'default'
    },
    initialize:function(){
          //初始化操作
   }

});
//定义一个Collection对象
var BookShelf=Backbone.Collection.extend({
		model:Book
});
//定义多个Book模型，并给title属性复制
var book1=new Book({title:'book1'});

var book2=new Book({title:'book2'});

var book3=new Book({title:'book3'});

//实例化一个Collection
var bookshelf=new BookShelf;
//将model添加到Collection中,这是集合管理Model的必要操作,可以使用不同的方式

//方式1：手动添加
bookshelf.add(book1);
bookshelf.add(book2);
bookshelf.add(book3)
//也可以移除
bookshelf.remove(book2);

//方式2：数组添加,在实例化Bookshelf的时候添加
var bookshelf=new BookShelf([book1,book2,book3]);

//方式3：使用each()遍历
bookShelf.each(function(book)){
  alert(book.get('title'));
});

OK,总的说来，借用BackboneJs官方文档的说法：

Collection集合是模型的有序组合，我们可以在集合上绑定 “change”
事件，从而当集合中的模型发生变化时fetch（获得）通知，集合也可以监听 “add” 和 “remove” 事件， 从服务器更新，并能使用
Underscore.js 提供的方法。

关于Collection的初探就到这里啦！下一篇中，将介绍对Collection的相关操作。

每篇一语

今天终于把东野圭吾的《解忧杂货铺》看完，一系列围绕浪矢杂货铺和丸光园的故事透露出了很多道理。在书的最后一页，是浪矢爷爷给三位年轻人那张空白信的回复，其中有这么一段话可以这样概括：把来找我咨询的人比喻成迷途的羊羔，通常他们手上都有地图，却没有去看，或是不知道自己目前的位置。但是地图如果是一张白纸的话，便可以随心所欲的描绘地图。所以，一切全在你自己，一切都是自由的，在你面前是无限的可能！
所以，借用这本书，我想说，如果你发现手中的地图给不了你现在的位置，那么这又有什么关系呢，重要的是你能否放下地图给你带来的束缚，去你想去的目的地！

盗用一张插画，好不错！^-

❤️ 现在关注【前端修罗场】，后台回复【666】，即可获取一份【免费的优质学习资料】,一起学习，一起进步，不走弯路，不吃亏~