underscore之Collections_动力节点Java学院整理


Posted in Javascript onJuly 10, 2017

underscore为集合类对象提供了一致的接口。集合类是指Array和Object,暂不支持Map和Set。

map/filter

和Array的map()与filter()类似,但是underscore的map()和filter()可以作用于Object。当作用于Object时,传入的函数为function (value, key),第一个参数接收value,第二个参数接收key:

'use strict';
var obj = {
  name: 'bob',
  school: 'No.1 middle school',
  address: 'xueyuan road'
};
var upper = _.map(obj, function (value, key) {
  return value;
});
alert(JSON.stringify(upper));

你也许会想,为啥对Object作map()操作的返回结果是Array?应该是Object才合理啊!把_.map换成_.mapObject再试试。

every / some

当集合的所有元素都满足条件时,_.every()函数返回true,当集合的至少一个元素满足条件时,_.some()函数返回true:

'use strict';
// 所有元素都大于0?
_.every([1, 4, 7, -3, -9], (x) => x > 0); // false
// 至少一个元素大于0?
_.some([1, 4, 7, -3, -9], (x) => x > 0); // true

当集合是Object时,我们可以同时获得value和key:

'use strict';
var obj = {
  name: 'bob',
  school: 'No.1 middle school',
  address: 'xueyuan road'
};
// 判断key和value是否全部是小写:
var r1 = _.every(obj, function (value, key) {
  return value;
});
var r2 = _.some(obj, function (value, key) {
  return value;
});
alert('every key-value are lowercase: ' + r1 + '\nsome key-value are lowercase: ' + r2);

max / min

这两个函数直接返回集合中最大和最小的数:

'use strict';
var arr = [3, 5, 7, 9];
_.max(arr); // 9
_.min(arr); // 3
// 空集合会返回-Infinity和Infinity,所以要先判断集合不为空:
_.max([])
-Infinity
_.min([])
Infinity

注意,如果集合是Object,max()和min()只作用于value,忽略掉key:

'use strict';
_.max({ a: 1, b: 2, c: 3 }); // 3

groupBy

groupBy()把集合的元素按照key归类,key由传入的函数返回:

'use strict';
var scores = [20, 81, 75, 40, 91, 59, 77, 66, 72, 88, 99];
var groups = _.groupBy(scores, function (x) {
  if (x < 60) {
    return 'C';
  } else if (x < 80) {
    return 'B';
  } else {
    return 'A';
  }
});
// 结果:
// {
//  A: [81, 91, 88, 99],
//  B: [75, 77, 66, 72],
//  C: [20, 40, 59]
// }

可见groupBy()用来分组是非常方便的。

shuffle / sample

shuffle()用洗牌算法随机打乱一个集合:

'use strict';
// 注意每次结果都不一样:
_.shuffle([1, 2, 3, 4, 5, 6]); // [3, 5, 4, 6, 2, 1]
sample()则是随机选择一个或多个元素:
'use strict';
// 注意每次结果都不一样:
// 随机选1个:
_.sample([1, 2, 3, 4, 5, 6]); // 2
// 随机选3个:
_.sample([1, 2, 3, 4, 5, 6], 3); // [6, 1, 4]
Javascript 相关文章推荐
JavaScript入门教程(3) js面向对象
Jan 31 Javascript
javascript 写类方式之七
Jul 05 Javascript
通过JS 获取Mouse Position(鼠标坐标)的代码
Sep 21 Javascript
javascript getElementsByClassName函数
Apr 01 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(四)用地图块拼成大地图
Jan 23 Javascript
select、radio表单回显功能实现避免使用jquery载入赋值
Jun 08 Javascript
jquery 新建的元素事件绑定问题解决方案
Jun 12 Javascript
Js实现滚动变色的文字效果
Jun 16 Javascript
node.js从数据库获取数据
May 08 Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 Javascript
js异步接口并发数量控制的方法示例
Nov 22 Javascript
ajax jquery实现页面某一个div的刷新效果
Mar 04 jQuery
Angular.js组件之input mask对input输入进行格式化详解
Jul 10 #Javascript
underscore之Chaining_动力节点Java学院整理
Jul 10 #Javascript
Vue 2.0的数据依赖实现原理代码简析
Jul 10 #Javascript
Vue实现virtual-dom的原理简析
Jul 10 #Javascript
Vue2路由动画效果的实现代码
Jul 10 #Javascript
深入浅析Node.js单线程模型
Jul 10 #Javascript
require.js中的define函数详解
Jul 10 #Javascript
You might like
Linux下手动编译安装PHP扩展的例子分享
2014/07/15 PHP
php根据某字段对多维数组进行排序的方法
2015/03/07 PHP
php中JSON的使用方法
2015/04/30 PHP
fix-ie5.js扩展在IE5下不能使用的几个方法
2007/08/20 Javascript
javascript引导程序
2008/10/26 Javascript
JS 文字符串转换unicode编码函数
2009/05/30 Javascript
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
js触发asp.net的Button的Onclick事件应用
2013/02/02 Javascript
谈谈JavaScript中的几种借用方法
2016/08/09 Javascript
Bootstrap modal 多弹窗之叠加显示不出弹窗问题的解决方案
2017/02/23 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
JavaScript实现短信倒计时60s
2017/10/09 Javascript
Vue表单类的父子组件数据传递示例
2018/05/03 Javascript
axios 封装上传文件的请求方法
2018/09/26 Javascript
JS实现图片切换效果
2018/11/17 Javascript
axios异步提交表单数据的几种方法
2019/08/11 Javascript
element-ui 本地化使用教程详解
2019/10/28 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
Node.js API详解之 vm模块用法实例分析
2020/05/27 Javascript
Python下载懒人图库JavaScript特效
2015/05/28 Python
Python实现程序的单一实例用法分析
2015/06/03 Python
python select.select模块通信全过程解析
2017/09/20 Python
利用Python裁切tiff图像且读取tiff,shp文件的实例
2020/03/10 Python
图片上传插件ImgUploadJS:用HTML5 File API 实现截图粘贴上传、拖拽上传
2016/01/20 HTML / CSS
What's the difference between an interface and abstract class? (接口与抽象类有什么区别)
2012/10/29 面试题
创业计划书撰写原则
2014/01/25 职场文书
学生安全责任书模板
2014/07/25 职场文书
乡镇镇长个人整改措施
2014/10/01 职场文书
2014年人力资源部工作总结
2014/11/19 职场文书
采购员岗位职责范本
2015/04/07 职场文书
执行力心得体会范文
2016/01/11 职场文书
珍惜时间的诗歌赏析
2019/08/23 职场文书
python实现图片批量压缩
2021/04/24 Python
Python基础之hashlib模块详解
2021/05/06 Python
为什么代码规范要求SQL语句不要过多的join
2021/06/23 MySQL
vue elementUI批量上传文件
2022/04/26 Vue.js