Lodash 快速上手
MaHongli 2019-11-25 JavaScript
# lodash
主要包含两个内容：
- lodash 简单介绍
- lodash 常见的一些方法
# lodash 简单介绍
lodash 是前端开发中一个很常见的库，它和 jQuery 相似，里面封装了涉及数组，字符串，函数，对象等处理方法。
整个 lodash 的方法可以分为以下几类：
- Array
- Collection
- Function
- Date
- Lang
- Math
- Number
- Object
- String
- Util
要使用 lodash，方法非常简单，可以通过 cdn 的形式来引入，还可以通过 npm 来安装
npm i lodash
1
# lodash 中常见的方法
# Array 相关方法
compact：过滤数组中的“假值”元素。
console.log(_.compact([0,1,false,2,'',3])); // [1,2,3]
1
difference: 返回一个新的数组，包括第一个数组和其他数组不同的元素。
console.log(_.difference([1,2,3,5],[2,3,4],[5,6])); // [1]
1
differenceBy: 功能和 difference 基本一样，只不过最后可以多传一个参数，表示迭代器。遍历数组中的每一个元素都会调用一次迭代器
console.log(_.differenceBy([3.1,2.2,1.3],[4.4,2.5],Math.floor)); // [3.1,1.3]
1
differenceWith:功能和 difference 也基本一样，只是最后可以传递一个比较器，遍历数组的每一个元素都会使用这个比较器，不相等返回false，相等返回 true。
let arr = [
{'x' : 1, 'y' : 2},
{'x' : 2, 'y' : 1}
];
console.log(_.differenceWith(arr,[{'x' : 1, 'y' : 2}],_.isEqual));
1
2
3
4
5
2
3
4
5
intersection: 返回一个新的数组，取传入数组的交集。
console.log(_.intersection([1,2,3],[2,3,4],[3,4,5])); // [3]
1
uniq: 数组去重
console.log(_.uniq([1,2,2,3,3,3,4,5,6,6,7])); // [1, 2, 3, 4, 5, 6, 7]
1
# 集合相关方法
find：查找集合中的元素，返回匹配的元素。如果有多个匹配，只返回第一个找到的。
const users = [
{name : 'william',age : 18},
{name : 'yaoyaojiang',age : 23},
{name : 'malaoshi',age : 20},
{name : 'wangyu',age : 21}
]
console.log(_.find(users,function(item){
return item.age >= 20;
})); // {name: "yaoyaojiang", age: 23}
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
sample: 从集合中随机取一个元素
const users = [
{name : 'william',age : 18},
{name : 'yaoyaojiang',age : 23},
{name : 'malaoshi',age : 20},
{name : 'wangyu',age : 21}
]
console.log(_.sample(users));
1
2
3
4
5
6
7
2
3
4
5
6
7
sampleSize:从集合中随机去固定个数的元素。
const users = [
{name : 'william',age : 18},
{name : 'yaoyaojiang',age : 23},
{name : 'malaoshi',age : 20},
{name : 'wangyu',age : 21}
]
console.log(_.sampleSize(users,2));
1
2
3
4
5
6
7
2
3
4
5
6
7
shuffle: 随机打乱集合的顺序。
console.log(_.shuffle([1,2,3,4,5]));
1
# Lang 相关方法
clone:浅拷贝
cloneDeep:深拷贝
random: 随机生成制定返回的数，参数有3个，随机的上限，下限，是否包含小数
console.log(_.random(0,5));
console.log(_.random(0,5,true));
1
2
2
times: 带次数的循环
_.times(5, function(i){
console.log(i);
})
1
2
3
2
3
