Lodash使用示例(比较全)
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Lodash使用示例</title>
<script src="~/Js/lodash.core.min.js"></script>
<script>
var users = [
{ 'user': 'barney', 'age': 36 },
{ 'user': 'fred', 'age': 40 },
{ 'user': 'pebbles', 'age': 18 }
];
var nums = [1, 2, 3]; /*****************************查找****************************************/
var names = _
.chain(users)
.map(function (o) {
return o.user;
})
.join(",")
.value();
console.log(names);
// => barney,fred,pebbles console.log(_.find(users, function (o) { return o.age >= 40; }));
// => object for 'fred' /******************************查找***************************************/
var oldest = _
.chain(users)
.sortBy('age')
.map(function (o) {
return '最年长的是：' + o.user + ' is ' + o.age;
})
.last()
.value();
console.log(oldest);
// => 最年长的是：fred is 40 /*************************************************************************/
var youngest = _
.chain(users)
.sortBy('age')
.map(function (o) {
return '最年轻的是：' + o.user + ' is ' + o.age;
})
.head()
.value();
console.log(youngest);
// => 最年轻的是：pebbles is 18 /*************************************************************************/
var userObj = _.chain(users)
.map(function (o) {
return [o.user, o.age];
})
.value();
console.log(userObj[0]);
// => ["barney", 36] /*************************************************************************/
/*
创建一个新数组，包含原数组中所有的非假值元素。
例如false, null, 0, "", undefined, 和 NaN 都是被认为是“假值”。
*/
var compact = _.compact([0, 1, false, 2, '', 3]);
console.log(compact);
// => [1, 2, 3] /*************************************************************************/
/* _.difference(array, [values])
array (Array): 要检查的数组。
[values] (...Array): 排除的值。
*/
//var difference = _.difference([3, 2, 1], [4, 2]);
console.log(_.difference([3, 2, 1], [4, 2]));
// => [3, 1] /*************************************************************************/
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
var differenceWith = _.differenceWith(objects, [{ 'x': 1, 'y': 2 }], _.isEqual);
console.log(differenceWith);
// => [{ 'x': 2, 'y': 1 }] /*************************************************************************/
//创建一个切片数组，去除array前面的n个元素。（n默认值为1。）
console.log(_.drop(nums, nums.length - 1));
// => [3] /*************************************************************************/
//创建一个切片数组，去除array尾部的n个元素。（n默认值为1。）
console.log(_.dropRight(nums, nums.length - 1));
// => [1] /*************************************************************************/
console.log(_.dropWhile(users, function (o) { return o.age == 36; }));
// => objects for ['fred', 'pebbles'] /*************************************************************************/
//返回找到元素的 索引值（index），找不到则返回 -1。
console.log(_.findIndex(users, function (o) { return o.user == 'fred'; }));
// => 1 /*************************************************************************/
console.log(_.head([3, 2, 1]));
console.log(_.first([3, 2, 1]));
// => 3 /*************************************************************************/
//返回 值value在数组中的索引位置, 没有找到为返回-1。
console.log(_.indexOf([1, 2, 3, 2], 2));
// => 1 /*************************************************************************/
//去除数组array中的最后一个元素
console.log(_.initial([1, 2, 3]));
// => [1, 2] /*************************************************************************/
//返回一个包含所有传入数组交集元素的新数组
console.log(_.intersection([2, 1], [4, 2], [1, 2]));
// => [2] /*************************************************************************/
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];
console.log(_.intersectionWith(objects, others, _.isEqual));
// => [{ 'x': 1, 'y': 2 }] console.log(_.join(['a', 'b', 'c'], ','));
// => a,b,c //返回array中的最后一个元素
console.log(_.last([1, 2, 3]));
// => 3 //获取array数组的第n个元素 索引从0开始，如果n为负数，则返回从数组结尾开始的第n个元素
console.log(_.nth([1, 2, 3], 1));
// => 2
console.log(_.nth([1, 2, 3, 4], -1));
// => 4 /*************************************************************************/
//移除数组array中所有和给定值相等的元素
console.log(_.pull([1, 2, 3, 1, 2, 3], 2, 3));
// => [1, 1]
console.log(_.pullAll([1, 2, 3, 1, 2, 3], [2, 3]));
// => [1, 1] //这个方法类似于_.pullAll
//区别是这个方法接受一个 iteratee（迭代函数），通过产生的值进行了比较。
console.log(_.pullAllBy(
[{ 'x': 1 }, { 'x': 2 }, { 'x': 3 }, { 'x': 1 }],
[{ 'x': 1 }, { 'x': 3 }],
'x'));
// => [{ 'x': 2 }] console.log(_.pullAllWith(
[{ 'x': 1, 'y': 2 }, { 'x': 3, 'y': 4 }, { 'x': 5, 'y': 6 }],
[{ 'x': 3, 'y': 4 }],
_.isEqual));
// => [{ 'x': 1, 'y': 2 }, { 'x': 5, 'y': 6 }] /*************************************************************************/
//返回被移除元素组成的新数组。
var array = [5, 10, 15, 20];
var evens = _.pullAt(array, 1, 3);
console.log(array);
// => [5, 15]
console.log(evens);
// => [10, 20] /*************************************************************************/
//返回被移除元素组成的新数组。
var array = [1, 2, 3, 4];
var evens = _.remove(array, function (n) {
return n % 2 == 0;
});
console.log(array);
// => [1, 3]
console.log(evens);
// => [2, 4] console.log(_.reverse([1, 2, 3]));
// => [3, 2, 1] //_.slice(array, [start=0], [end=array.length])
//裁剪数组array，从 start 位置开始到end结束，但不包括 end 本身的位置
console.log(_.slice([1, 2, 3], 1));
// => [2, 3] //返回一个新的不重复的数组
console.log(_.uniq([1, 1, 2, 1, 1, 2, 3]));
// => [1, 2, 3]
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 2 }];
console.log(_.uniqWith(objects, _.isEqual));
// => [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }] /*************************************************************************/
var arr = [
{ name: 'aa', age: 22 },
{ name: 'bb', age: 18 },
{ name: 'cc', age: 40 }
];
console.log(_.sortBy(arr, function (o) { return o.age; }));
console.log(_.sortBy(arr, ['age'])); //可多字段排序['name','age'] console.log(_.groupBy([6.1, 4.2, 6.6], Math.floor));
// => { '4': [4.2], '6': [6.1, 6.3] } /*****************************循环***************************************/
_([1, 2]).forEach(function (value) {
console.log(value);
});
// => Logs '1' then '2' _.forEach({ 'a': 1, 'b': 2 }, function (value, key) {
console.log(key + " " + value);
});
// => Logs 'a 1' then 'b 2' /*****************************查找***************************************/
var collection1 = [
{ name: 'aa', age: 20, gender: 'm' },
{ name: 'bb', age: 21, gender: 'f' },
{ name: 'cc', age: 22, gender: 'm' }
]; /*****************************包含***************************************/
console.log(_.includes({ 'user': 'fred', 'age': 40 }, 'fred'));
// => true /*****************************包含***************************************/
function square(n) {
return n * n;
}
console.log(_.map([4, 8], square));
// => [16, 64] /*****************************排序***************************************/
var users = [
{ 'user': 'fred', 'age': 48 },
{ 'user': 'barney', 'age': 34 },
{ 'user': 'fred', 'age': 40 },
{ 'user': 'barney', 'age': 36 }
];
// 以 `user` 升序排序 再 `age` 以降序排序。
console.log(_.orderBy(users, ['user', 'age'], ['asc', 'desc']));
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]] /*****************************长度***************************************/
console.log(_.size([1, 2, 3]));
// => 3
console.log(_.size('pebbles'));
// => 7
console.log(_.size('歌曲abc'));
// => 5 //now 获得 Unix 纪元 (1 January 1970 00:00:00 UTC) 直到现在的毫秒数。
//var temp = _.defer(function (stamp) {
// console.log(_.now() - stamp);
//}, _.now());
//console.log(_.now() + "______" + temp); /*****************************强制转换数组************************************/
//如果不是数组, 那么强制转为数组。
console.log(_.castArray(1));
// => [1] console.log(_.castArray({ 'a': 1 }));
// => [{ 'a': 1 }] console.log(_.castArray('abc'));
// => ['abc'] /*****************************拷贝************************************/
//_.clone(value) 创建一个 value 的浅拷贝
var objects = [{ 'a': 1 }, { 'b': 2 }];
var shallow = _.clone(objects);
console.log(shallow[0] === objects[0]);
// => true /*****************************等于************************************/
var object = { 'a': 1 };
var other = { 'a': 1 };
console.log(_.eq(object, object)); // => true
console.log(_.eq(object, other)); // => false
console.log(_.eq(1, 1)); // => false console.log("--------------------------------------------------------");
/*****************************大于************************************/
console.log(_.gt(3, 1)); // => true
/*****************************大于等于********************************/
console.log(_.gte(3, 3)); // => true
/*****************************小于************************************/
console.log(_.lt(1, 3)); // => true
/*****************************小于等于********************************/
console.log(_.lte(3, 3)); // => true //是否数组
console.log(_.isArray([1, 2, 3])); // => true
console.log(_.isArray('abc')); // => false
//是否boolean型
console.log(_.isBoolean(false)); // => true console.log("--------------------------------------------------------");
//是否日期类型
console.log(_.isDate('02 31 2017')); // => false
console.log(_.isDate(new Date)); // => true
//是否整数
console.log(_.isInteger(3)); // => true
console.log(_.isInteger(3.1)); // => false
console.log(_.isInteger('3')); // => false
//是否字符串
console.log(_.isString('abc')); // => true
console.log(_.isString(1)); // => false
/*****************************转换成数组********************************/
console.log(_.toArray('abc'));
// => ['a', 'b', 'c'] //向上取精度 _.ceil(number, [precision=0])
console.log(_.ceil(6.014, 2));
// => 6.02 //向下取精度 _.floor(number, [precision=0])
console.log(_.floor(6.014, 2));
// => 6.01 //四舍五入取精度
console.log(_.round(4.006, 2));
// => 4.01 //返回最大数
console.log(_.max([4, 2, 8, 6])); // => 8
console.log(_.maxBy(users, function (o) { return o.age })); // => {user: "fred", age: 48} //返回平均值
console.log(_.mean([4, 2, 8, 6])); // => 5
console.log(_.meanBy(users, function (o) { return o.age })); // => 39.5 //返回最小数
console.log(_.min([4, 2, 8, 6])); // => 2
console.log(_.minBy(users, function (o) { return o.age })); // => {user: "barney", age: 34} //求和
console.log(_.sum([4, 2, 8, 6])); // => 20
console.log(_.sumBy(users, function (o) { return o.age })); // => 158 //检查字符串string是否以给定的target字符串开始
console.log(_.startsWith('abc', 'a')); // => true
//检查字符串string是否以给定的target字符串结尾
console.log(_.endsWith('abc', 'c')); // => true /*****************************Pad填充********************************/
console.log(_.pad('abc', 8, '#')); // => ##abc###
console.log(_.padEnd('abc', 8, '#')); // => abc#####
console.log(_.padStart('abc', 8, '#')); // => #####abc console.log(_.repeat('abc', 2)); // => 'abcabc'
console.log(_.repeat('abc', 0)); // => '' console.log(_.replace('Hi Fred Fred', 'Fred', 'Barney')); // => 'Hi Barney Fred' console.log(_.trim('##abc###', '#')); // => abc
console.log(_.trimStart('##abc###', '#')); // => abc###
console.log(_.trimEnd('##abc###', '#')); // => #abc console.log(_.truncate('hi-diddly-ho there, neighborino', { 'length': 5 })); // => hi...
</script>
</head>
<body>
<div>
</div>
</body>
</html>
Lodash使用示例(比较全)的更多相关文章
- JavaScript内容梳理 示例之模态对话框 示例之全选和反选以及取消 示例之后台管理左侧菜单
<!DOCTYPE html> <!--示例之模态对话框--> <html lang="en"> <head> <meta c ...
- jQuery菜单示例（全选，反选，取消）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Linux常用命令及示例（全）
NO 分类 PS1 命令名 用法及参数 功能注解1 显示目录信息 # ls ls -a 列出当前目录下的所有文件,包括以.头的隐含文件 # ls ls -l或ll 列出当前目录下文件的详细信息 # l ...
- JavaScript学习笔记(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例
一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...
- JavaScript学习总结(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例
一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...
- HBase Java简单示例
Hbase采用Java实现,原生客户端也是Java实现,其他语言需要通过thritf接口服务间接访问Hbase的数据. Hbase作为大数据存储数据库,其写能力非常强,加上Hbase本身就脱胎于Had ...
- HBase Java简单示例--转载
Hbase采用Java实现,原生客户端也是Java实现,其他语言需要通过thritf接口服务间接访问Hbase的数据. Hbase作为大数据存储数据库,其写能力非常强,加上Hbase本身就脱胎于Had ...
- JavaScript学习总结(二)——延迟对象、跨域、模板引擎、弹出层、AJAX示例
一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...
- sencha touch Demo(示例)(2014-6-25)
这是一个开源示例,是我对sencha touch的深层应用.已停止更新 sencha touch版本:2.2.1/2.3.1 源码地址: https://bitbucket.org/moLangZai ...
随机推荐
- <hx>标签 字体自动加粗 自动换行
<hx>标签 字体自动加粗 自动换行
- hdu2295-Radar
有n个城市,\(m\)个雷达,\(k\)个操作员,每个操作员只能操作一个雷达.每个雷达的覆盖范围是一个以雷达坐标为中心的圆,所有雷达的覆盖半径是相同的. 现在给出这\(n\)个城市,\(m\)个雷达的 ...
- BZOJ3670 [Noi2014]动物园 【KMP计数】
3670: [Noi2014]动物园 Time Limit: 10 Sec Memory Limit: 512 MB Submit: 3143 Solved: 1690 [Submit][Stat ...
- bzoj1297: [SCOI2009]迷路(矩阵乘法+拆点)
题目大意:有向图里10个点,点与点之间距离不超过9,问从1刚好走过T距离到达n的方案数. 当时看到这题就想到了某道奶牛题(戳我).这两道题的区别就是奶牛题问的是走T条边,这道题是每条边都有一个边权求走 ...
- dubbox管理中心
当服务多了,不好管理,可以用管理中心来查看. 管理中心就是一个 web项目(一个war包),可以部署在tomcat下面就能运行了. 用户名密码都是root 每一条服务点开后都可以看生产者和消费者.
- Codeforces Round #392 (Div. 2) A B C 水 模拟 暴力
A. Holiday Of Equality time limit per test 1 second memory limit per test 256 megabytes input standa ...
- HDU3308 线段树（区间合并）
LCIS Time Limit: 6000/2000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submis ...
- Kafka消息delivery可靠性保证(Message Delivery Semantics)
原文见:http://kafka.apache.org/documentation.html#semantics kafka在生产者和消费者之间的传输是如何保证的,我们可以知道有这么几种可能提供的de ...
- JS鼠标滚轮事件解析
一.不同浏览器的鼠标滚轮事件 首先,不同的浏览器有不同的滚轮事件.主要是有两种,onmousewheel(IE/Opera/Chrome支持,firefox不支持)和DOMMouseScroll(只有 ...
- 2015/9/9 Python基础(10)：文件和输入输出
文件对象文件对象不仅可以用来访问普通的磁盘文件,而且也可以访问其它任何类型抽象层面上的“文件”.一旦设置了合适的“钩子”,你就可以访问文件类型接口的其它对象,就好像访问的是普通文件一样.文件对象的处理 ...