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动态添加列的方法
Mar 25 Javascript
jQuery实现的左右移动焦点图效果
Jan 14 Javascript
jQuery无刷新上传之uploadify3.1简单使用
Jun 18 Javascript
jQuery实现点击弹出背景变暗遮罩效果实例代码
Jun 24 Javascript
jQuery实现的无限级下拉菜单功能示例
Sep 12 Javascript
AngularJS Phonecat实例讲解
Nov 21 Javascript
浅谈Webpack自动化构建实践指南
Dec 18 Javascript
重新认识vue之事件阻止冒泡的实现
Aug 02 Javascript
Vue-cli@3.0 插件系统简析
Sep 05 Javascript
angular6的响应式表单的实现
Oct 10 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
Apr 26 Javascript
前端使用crypto.js进行加密的函数代码
Aug 16 Javascript
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
mysql 搜索之简单应用
2007/04/27 PHP
详解PHP中的Traits
2015/07/29 PHP
如何正确配置Nginx + PHP
2016/07/15 PHP
thinkPHP5分页功能实现方法分析
2017/10/25 PHP
PHP开发之归档格式phar文件概念与用法详解【创建,使用,解包还原提取】
2017/11/17 PHP
php正则表达式使用方法整理集合
2020/01/31 PHP
心扬JS分页函数代码
2010/09/10 Javascript
js下用eval生成JSON对象
2010/09/17 Javascript
JS小游戏之极速快跑源码详解
2014/09/25 Javascript
AngularJS入门教程(一):静态模板
2014/12/06 Javascript
移除AngularJS下URL中的#字符的方法
2015/06/19 Javascript
JavaScript数据类型判定的总结笔记
2015/07/31 Javascript
基于JavaScript的操作系统你听说过吗?
2016/01/28 Javascript
论JavaScript模块化编程
2016/03/07 Javascript
微信小程序 wxapp内容组件 progress详细介绍
2016/10/31 Javascript
JS识别浏览器类型(电脑浏览器和手机浏览器)
2016/11/18 Javascript
jQuery 插件实现随机自由弹跳气泡样式
2017/01/12 Javascript
使用Node.js实现一个多人游戏服务器引擎
2019/03/13 Javascript
layui 表单标签的校验方法
2019/09/04 Javascript
Python Web框架Flask中使用百度云存储BCS实例
2015/02/08 Python
python+pyqt实现右下角弹出框
2017/10/26 Python
Python内置函数delattr的具体用法
2017/11/23 Python
Python简单实现网页内容抓取功能示例
2018/06/07 Python
python分块读取大数据,避免内存不足的方法
2018/12/10 Python
Python 一行代码能实现丧心病狂的功能
2020/01/18 Python
html5+css3之CSS中的布局与Header的实现
2014/11/21 HTML / CSS
美国Randolph太阳镜官网:美国制造的飞行员太阳镜和射击眼镜
2018/06/15 全球购物
写出二分查找算法的两种实现
2013/05/13 面试题
县优秀教师事迹材料
2014/01/31 职场文书
银行员工考核评语
2014/12/31 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书
社区法制宣传月活动总结
2015/05/07 职场文书
网聊搭讪开场白
2015/05/28 职场文书
nginx前后端同域名配置的方法实现
2021/03/31 Servers
解决Mysql多行子查询的使用及空值问题
2022/01/22 MySQL
springmvc直接不经过controller访问WEB-INF中的页面问题
2022/02/24 Java/Android