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 相关文章推荐
浅析node.js中close事件
Nov 26 Javascript
jQuery xml字符串的解析、读取及查找方法
Mar 01 Javascript
jQuery实现的可编辑表格完整实例
Jun 20 Javascript
使用JQuery选择HTML遍历函数的方法
Sep 17 Javascript
JS/jQuery判断DOM节点是否存在的简单方法
Nov 24 Javascript
js时间查询插件使用详解
Apr 07 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
微信小程序实现定位及到指定位置导航的示例代码
Aug 20 Javascript
JavaScript实现更换背景图片
Oct 18 Javascript
微信小程序webSocket的使用方法
Feb 20 Javascript
jquery实现穿梭框功能
Jan 19 jQuery
Vue Element UI自定义描述列表组件
May 18 Vue.js
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 正则判断中文UTF-8或GBK的思路及具体实现
2013/11/26 PHP
php生成百度sitemap站点地图类函数实例
2014/10/17 PHP
php+html5使用FormData对象提交表单及上传图片的方法
2015/02/11 PHP
memcache一致性hash的php实现方法
2015/03/05 PHP
PHP统一页面编码避免乱码问题
2015/04/09 PHP
使用php实现网站验证码功能【推荐】
2017/02/09 PHP
php高清晰度无损图片压缩功能的实现代码
2018/12/09 PHP
详解Laravel设置多态关系模型别名的方式
2019/10/17 PHP
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
jQuery源码解读之addClass()方法分析
2015/02/20 Javascript
简介JavaScript中的setTime()方法的使用
2015/06/11 Javascript
底部悬浮通栏可以关闭广告位的实现方法
2016/06/01 Javascript
vue.js实现单选框、复选框和下拉框示例
2017/07/18 Javascript
浅谈vue2 单页面如何设置网页title
2017/11/08 Javascript
nodejs实现大文件(在线视频)的读取
2020/10/16 NodeJs
解决Webpack 热部署检测不到文件变化的问题
2018/02/22 Javascript
vue.js实现二级菜单效果
2019/10/19 Javascript
jquery添加div实现消息聊天框
2020/02/08 jQuery
vue设置全局访问接口API地址操作
2020/08/14 Javascript
vue 子组件和父组件传值的示例
2020/09/11 Javascript
python里大整数相乘相关技巧指南
2014/09/12 Python
对IPython交互模式下的退出方法详解
2019/02/16 Python
Python使用pyserial进行串口通信的实例
2019/07/02 Python
Django Rest framework权限的详细用法
2019/07/25 Python
python 求定积分和不定积分示例
2019/11/20 Python
浅谈python已知元素,获取元素索引(numpy,pandas)
2019/11/26 Python
django 文件上传功能的相关实例代码(简单易懂)
2020/01/22 Python
python学习笔记之多进程
2020/08/06 Python
python爬虫今日热榜数据到txt文件的源码
2021/02/23 Python
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
介绍一下木马病毒的种类
2015/07/26 面试题
文体活动总结范文
2014/05/05 职场文书
四风问题个人剖析材料
2014/10/07 职场文书
培养联系人考察意见
2015/06/01 职场文书
2015年高中生国庆节演讲稿
2015/07/30 职场文书
十大最强电系宝可梦,阿尔宙斯电系之一,第七被称为雷神
2022/03/18 日漫