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 相关文章推荐
改变文件域的样式实现思路同时兼容ie、firefox
Oct 23 Javascript
图片翻转效果具体实现代码
Jan 09 Javascript
用js将内容复制到剪贴板兼容浏览器
Mar 18 Javascript
jquery ajax双击div可直接修改div中的内容
Mar 04 Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
Sep 16 Javascript
微信小程序  modal详解及实例代码
Nov 09 Javascript
JavaScript中Require调用js的实例分享
Oct 27 Javascript
Vue中render方法的使用详解
Jan 26 Javascript
express框架下使用session的方法
Jul 31 Javascript
koa-passport实现本地验证的方法示例
Feb 20 Javascript
Element实现表格嵌套、多个表格共用一个表头的方法
May 09 Javascript
从源码角度来回答keep-alive组件的缓存原理
Jan 18 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
php面向对象全攻略 (六)__set() __get() __isset() __unset()的用法
2009/09/30 PHP
php 目录与文件处理-郑阿奇(续)
2011/07/04 PHP
深入理解require与require_once与include以及include_once的区别
2013/06/05 PHP
PHP实现XML与数据格式进行转换类实例
2015/07/29 PHP
php使用mysqli和pdo扩展,测试对比mysql数据库的执行效率完整示例
2019/05/09 PHP
JavaScript操作XML/HTML比较常用的对象属性集锦
2015/10/30 Javascript
浅析Bootstrap缩略图组件与警示框组件
2016/04/29 Javascript
Javascript基础_标记文字的实现方法
2016/06/14 Javascript
jQuery实现智能判断固定导航条或侧边栏的方法
2016/09/04 Javascript
JavaScript实现窗口抖动效果
2016/10/19 Javascript
JavaScript实现简单的树形菜单效果
2017/06/23 Javascript
underscore之Collections_动力节点Java学院整理
2017/07/10 Javascript
解决使用Vue.js显示数据的时,页面闪现原始代码的问题
2018/02/11 Javascript
Node.js搭建WEB服务器的示例代码
2018/08/15 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
2018/09/28 Javascript
Nodejs实现多文件夹文件同步
2018/10/17 NodeJs
vue2 中二级路由高亮问题及配置方法
2019/06/10 Javascript
layui实现数据表格自定义数据项
2019/10/26 Javascript
Python读写Redis数据库操作示例
2014/03/18 Python
python字典基本操作实例分析
2015/07/11 Python
Python按行读取文件的实现方法【小文件和大文件读取】
2016/09/19 Python
详解django中自定义标签和过滤器
2017/07/03 Python
python 日志增量抓取实现方法
2018/04/28 Python
对Python w和w+权限的区别详解
2019/01/23 Python
pytorch常见的Tensor类型详解
2020/01/15 Python
Python使用内置函数setattr设置对象的属性值
2020/10/16 Python
python搜索算法原理及实例讲解
2020/11/18 Python
详解pycharm自动import所需的库的操作方法
2020/11/30 Python
HTML5几个设计和修改的页面范例分享
2015/09/29 HTML / CSS
Canal官网:巴西女性时尚品牌
2019/10/16 全球购物
清明节扫墓活动方案
2014/03/02 职场文书
小班上学期幼儿评语
2014/12/30 职场文书
淘宝文案策划岗位职责
2015/04/14 职场文书
东京审判观后感
2015/06/01 职场文书
如何书写授权委托书?
2019/06/25 职场文书
解决jupyter notebook启动后没有token的坑
2021/04/24 Python