backbonejs中的集合篇(一)
一:集合概念
集合是多个模型,如果把模型model理解为表结构中的行,那么集合collection就是一张表,由多个行组成。我们经常需要用集合来组织和管理多个模型。
二:创建集合
1:扩展Backbone.Collection对象,指定为哪个模型创建集合,传参数model.
var _collection = Backbone.Collection.extend({
model: _model
});
2:创建集合实例,传模型数组参数来初始化; 现假定_model的dafault属性为(name,gender,age),实例对象为testModel
var testObj = new _collection(
[{name:'001',gender:'women',age:'23'}, {name:'002',gender:'man',age:'33'}, {name:'003',gender:'women',age:'28'}]);
在集合内部,模型被存储在一个名为models的数组中
除了数组参数来初始化,还可以用单个模型对象来初始化。
如:model1 = new _model({name:'001',gender:'women',age:'23'}); model2 = new _model({name:'002',gender:'man',age:'33'});
var testObj = new _collection([ model1, model2]);
三:对集合的操作
1:at() 通过索引获取集合中某个模型
var model = testObj.at(2); //{name:'003',gender:'women',age:'28'}
model.get('name'); //003
在集合内部,模型被存储在一个名为models的数组中,他的第一个元素索引下标为0
2:indexOf() 获取模型的索引值 该方法从Underscore.js中继承过来
如上面的model, testObj.indexOf(model); //2
3:clone() 获取一个模型对象的深拷贝。
(深拷贝:用clone方法,这样克隆的模型对象与实际在集合中存储的对象不是同一个对象,对其中一个值改变不影响其他对象)
(浅拷贝:用at()索引值获取的模型对象与集合中的对象是同一个对象,相互操作会有影响)
如: another = testObj.at(2).clone(); another.set('name':'test');
another.get('name'); //test testObj.at(2).get('name'); //002
3:length() 获取集合长度 len = testObj.length //3 model = testObj.at(len-1)
4:add() 添加新模型到集合末端
testObj.add({name:'004',age:'30',denger:'women'}) 加一个模型,
testObj.add([{name:'005',age:'30',denger:'women'},{name:'006',age:'30',denger:'women'}]) 加模型数组
也可以加已有的模型对象
注: add方法保证了重复的模型不会被添加到集合,不重复的才会添加到内部数组models中
5:{at:index} 在指定位置上添加模型
testObj.add({name:'000',age:'30',denger:'women'}, {at:0}) 此时 testObj.at(0).get('name') 输出000
6:remove() 移除模型,参数可以为一个单独的值也可以是数组,可传入模型的id,cid,或者模型对象
如 testObj.remove(model) testObj.remove([c1,c2])
调用remove时, 会从models中删除模型,并且模型与集合间的引用关系都会删除
7:reset() 删除/清空集合中的所有模型,并添加新模型
如:testObj.reset([{name:'A',age:3,gender:'boy'},{name:'B',age:2,:gender:'gril'}]);
8:以栈和队列方式使用集合 push pop unshift shift
testObj.push(model)
9:排序 comparator回调函数接受一个模型对象作为其唯一的参数,返回要排序的属性。
a: testObj.comparator = function(testModel){ return testModel.get('age');} //集合会根据age来排序
b: testObj.sort(); //调用sort手动出发排序
当调用comparator回调函数后,只要后续有插入的新模型,该回调都会被调用,将新模型插入到适合的位置。
10:where() 对集合中的模型进行过滤,可以传入一个或多个搜索条件
如: var result= testObj.where({name:'A'}); 此时result仅是内部模型数组models的一数组,要使用它还得new一个对象数组
var resultcollection = new _collection(result) //{name:'A',age:3,gender:'boy'}
11:遍历集合 each()
str = '';
testObj.each(function(model,index,list){
str += model.get('name');} //AB
参数: model :当前模型; index:当前模型在集合中的下标; list:整个模型数组
12:every() 检测满足所有条件
person = testObj.every(function(model){ return model.get('age')>18;}) //false 有一个不满足条件就返回false
13: some() 有一个满足条件就返回true
14: pluck() 返回集合中某个属性值的数组 如:testObj.pluck('name') //['A', 'B']
15:map() 对各模型属性值进行计算,返回数组 testObj.map(function(model){return model.get('name')+' '+model.get('gender')}) // ['A boy', 'B gril']
16:reduce() 把个模型归并成一个单一的值 testObj.reduce(function(memo,model){return memo+model.get('age')},0) //5
17:chain() 链式操作,可以通过它在调用一个方法完毕后再其结果上通过‘.’来调用另一个方法。
如 假设collection的models为[{num:22,count:10,name:'aa'},{num:1,count:2,name:'test'}]
testObj.chain().map(function(model){
return model.get('num')+model.get('count'); //['32', '3']
}).reduce(function(memo,val){
return memo + val;}).value(); //35
backbonejs中的集合篇(一)的更多相关文章
- backbonejs中的模型篇(三)
一:在模型中使用嵌套属性 Backbone的扩展插件 Backbone-Nested下载并添加引用 1:定义一个新的模型对象,使用Backbone.NestedModel作为其基类对象 var _mo ...
- backbonejs中的模型篇(二)
一:模型标识符 每个模型都有一个用作唯一标识符的ID属性,以便在不同模型间进行区分.通过id属性我们可以直接访问模型对象当中用于标识符存放的属性,默认属性名为id,但也可以通过设置idAttribut ...
- backbonejs中的模型篇(一)
一:模型及属性 模型是MVC应用的基石,它负责存放应用所需的数据,对数据的验证,执行访问控制,以及实现应用所需的特定业务逻辑. backbone通过扩展Backbone.Model对象来定义一个模型. ...
- Java中的集合List - 入门篇
前言 大家好啊,我是汤圆,今天给大家带来的是<Java中的集合List - 入门篇>,希望对大家有帮助,谢谢 简介 说实话,Java中的集合有很多种,但是这里作为入门级别,先简单介绍第一种 ...
- Java中的集合Set - 入门篇
前言 大家好啊,我是汤圆,今天给大家带来的是<Java中的集合Set - 入门篇>,希望对大家有帮助,谢谢 简介 前面介绍了集合List,映射Map,最后再简单介绍下集合Set,相关类如下 ...
- python学习之【第七篇】:Python中的集合及其所具有的方法
1.前言 python中的集合set与列表类似,它们最大的区别是集合内不允许出现重复元素,如果在定义时包含重复元素,会自动去重. 集合是无序的,集合中的元素必须是不可变类型.集合可以作为字典的key. ...
- JavaSE中Collection集合框架学习笔记(2)——拒绝重复内容的Set和支持队列操作的Queue
前言:俗话说“金三银四铜五”,不知道我要在这段时间找工作会不会很艰难.不管了,工作三年之后就当给自己放个暑假. 面试当中Collection(集合)是基础重点.我在网上看了几篇讲Collection的 ...
- JavaSE中Collection集合框架学习笔记(3)——遍历对象的Iterator和收集对象后的排序
前言:暑期应该开始了,因为小区对面的小学这两天早上都没有像以往那样一到七八点钟就人声喧闹.车水马龙. 前两篇文章介绍了Collection框架的主要接口和常用类,例如List.Set.Queue,和A ...
- 【JVM虚拟机】(7)---深入理解Class中-属性集合
#[JVM虚拟机](7)---深入理解Class中-属性集合 之前有关class文件已经写了两篇博客: 1.[JVM虚拟机](5)---深入理解JVM-Class中常量池 2.[JVM虚拟机](6)- ...
随机推荐
- C#打印条码的几种方式
标题虽然是说C#,但是以下介绍的几种方法不是只能在C#中使用,在其它的语言里面也行. 总结一下常见的条码打印方法,其实打条码的方式很多,大概有以下几种: 1.斑马打印软件制作好模板,保存为.prn格式 ...
- phpcms 内容——>评论管理 中添加 打开文章链接的 功能
需要实现的功能:在后台管理系统中的 内容 下的——>评论管理 中添加 打开文章链接的 功能 1.数据库表是 v9_comment和v9_comment_data_1. v9_comment是被 ...
- iOS - 3DTouch 3D 触摸
1.3DTouch 简介 3DTouch 是 iOS9 + 系统下,在 iPhone6s(iPhone6s Plus)+ 手机上才能够使用的功能. 1.1 3DTouch 基本类型 1.主屏幕快速选项 ...
- oracle的正则表达式
阅读目录 1.oracle(regular expression)简单介绍 2.oracle正则特殊字符 3.oracle正则字符簇 4.各种操作符的运算优先级 5.模拟测试例子 6.oracle对应 ...
- Linux下搭建SVN服务
SVN有几种方式进行访问,比较常见的是通过自带协议访问(svn://),配置很简单,还有一种就是http协议访问,需要结合apache服务,配置相对繁琐. 安装svn yum -y install s ...
- html5实现GIF动画!
代码如下: <!DOCTYPE html><html> <head> <meta charset="utf-8"&g ...
- 关于Java函数传参以及参数在函数内部改变的问题——JAVA值传递与引用最浅显的说明!
看了很多关于阐述JAVA传参到底是值传递还是引用的问题,有些说得很肤浅让人感觉似懂非懂的感觉,但是好像又能解决一些问题,然后就止步了.还有一些则是,讲得很深奥,看着好像很有道理的样子,但是其实还是没怎 ...
- ajax跨域jsonp
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...
- [css] px em rem
一.区别 px是相对于显示器屏幕分辨率而言的. em相对于浏览器的默认字体尺寸. rem相对于HTML根元素. 二.使用 1.em 任意浏览器的默认字体高都是16px.所有未经调整的浏览器都符合: ...
- Maven——聚合与继承
原文:http://www.cnblogs.com/xdp-gacl/p/4058008.html 一.聚合 如果我们想一次构建多个项目模块,那我们就需要对多个项目模块进行聚合 1.1.聚合配置代码 ...