6.lodash

lodash

主要包含两个内容：

• lodash 简单介绍
• lodash 常见的一些方法

lodash 简单介绍

lodash 是前端开发中一个很常见的库，它和 jQuery 相似，里面封装了涉及数组，字符串，函数，对象等处理方法。

整个 lodash 的方法可以分为以下几类：

• Array
• Collection
• Function
• Date
• Lang
• Math
• Number
• Object
• String
• Util

要使用 lodash，方法非常简单，可以通过 cdn 的形式来引入，还可以通过 npm 来安装

npm i lodash

lodash 中常见的方法

Array 相关方法

compact：过滤数组中的“假值”元素。

console.log(_.compact([0,1,false,2,'',3])); // [1,2,3]

difference: 返回一个新的数组，包括第一个数组和其他数组不同的元素。

console.log(_.difference([1,2,3,5],[2,3,4],[5,6])); // [1]

differenceBy: 功能和 difference 基本一样，只不过最后可以多传一个参数，表示迭代器。遍历数组中的每一个元素都会调用一次迭代器

console.log(_.differenceBy([3.1,2.2,1.3],[4.4,2.5],Math.floor)); // [3.1,1.3]

differenceWith:功能和 difference 也基本一样，只是最后可以传递一个比较器，遍历数组的每一个元素都会使用这个比较器，不相等返回false，相等返回 true。

 let arr = [
   {'x' : 1, 'y' : 2},
   {'x' : 2, 'y' : 1}
 ];
console.log(_.differenceWith(arr,[{'x' : 1, 'y' : 2}],_.isEqual));

intersection: 返回一个新的数组，取传入数组的交集。

console.log(_.intersection([1,2,3],[2,3,4],[3,4,5])); // [3]

uniq: 数组去重

console.log(_.uniq([1,2,2,3,3,3,4,5,6,6,7])); // [1, 2, 3, 4, 5, 6, 7]

集合相关方法

find：查找集合中的元素，返回匹配的元素。如果有多个匹配，只返回第一个找到的。

 const users = [
   {name : 'xiejie',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}

sample: 从集合中随机取一个元素

const users = [
  {name : 'xiejie',age : 18},
  {name : 'yaoyaojiang',age : 23},
  {name : 'malaoshi',age : 20},
  {name : 'wangyu',age : 21}
]
console.log(_.sample(users)); 

sampleSize:从集合中随机去固定个数的元素。

const users = [
  {name : 'xiejie',age : 18},
  {name : 'yaoyaojiang',age : 23},
  {name : 'malaoshi',age : 20},
  {name : 'wangyu',age : 21}
]
console.log(_.sampleSize(users,2));

shuffle: 随机打乱集合的顺序。

console.log(_.shuffle([1,2,3,4,5]));

Lang 相关方法

clone:浅拷贝

cloneDeep:深拷贝

random: 随机生成制定返回的数，参数有3个，随机的上限，下限，是否包含小数

console.log(_.random(0,5));
console.log(_.random(0,5,true));

times: 带次数的循环

 _.times(5, function(i){
   console.log(i);
 })