Loadash 让你的代码更简单-数组篇(上)

255 阅读3分钟

官方文档:www.lodashjs.com/

Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。

Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。 Lodash 的模块化方法 非常适用于:

  • 遍历 array、object 和 string
  • 对值进行操作和检测
  • 创建符合功能的函数

_.chunk(array, [size=1]) 返回一个二维数组

_.chunk(['a', 'b', 'c', 'd'], 2);
// => [['a', 'b'], ['c', 'd']]

_.compact(array) 过滤数组中‘假值’的过滤器

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

_.concat(array, [values]) 将第二个参数的值拼接到第一个参数数组中,得到新数组

var array = [1];
var other = _.concat(array, 2, [3], [[4]]);

console.log(other);
// => [1, 2, 3, [4]]

_.difference(array, [values]) 接收两个数组a,b;去除a中和b中相同的值,得到新数组

const arr2 = [0, 1, 2, 3];
const difference = _.difference(arr2, [1, 3]);
console.log(difference, 'difference'); // => [0, 2]
console.log(arr2, 'arr2-原数组');

_.differenceBy(array, [values], [iteratee=_.identity]) 类似_.difference() 第三个参数会先遍历参数1、2,然后再从1中排出和2中相同的值,得到新数组

const arr3 = [0.1, 1.5, 2.6, 3.7, 2.8];
const differenceBy = _.differenceBy(arr3, [1.4, 2.4], Math.floor);
console.log(differenceBy, 'differenceBy'); // => [0.1, 3.7]
console.log(arr3, 'arr3-原数组');

_.differenceWith(array, [values], [comparator])类似_.difference() 第三个参数会调用参数1、2进行比较,然后再从1中排出和2中相同的值,得到新数组

var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
_.differenceWith(objects, [{ 'x': 1, 'y': 2 }], _.isEqual);
// => [{ 'x': 2, 'y': 1 }]

_.drop(array, [n=1]) 第二个参数表示长度默认为1,数组从左往右去掉某个长度的值

_.drop([1, 2, 3]);
// => [2, 3]
_.drop([1, 2, 3], 2);
// => [3]

_.dropRight(array, [n=1]) 反向切除数组数据 _.drop()

_.fill(array, value, [start=0], [end=array.length])填充/替换数组中的值,从开始位置替换到结束位置,但不包含结束位置(即结束位置的上一个位置)

var array = [1, 2, 3];

_.fill(array, 'a');
console.log(array);
// => ['a', 'a', 'a']
_.fill([4, 6, 8, 10], '*', 1, 3)
// => [4, '*', '*', 10]

_.findIndex(array, [predicate=_.identity], [fromIndex=0])类似_.fill(),但返回的不是该值,而是在遍历第一个参数中返回该值的索引,或未找到返回-1;

_.findLastIndex(array, [predicate=_.identity], [fromIndex=array.length-1]) 反向_.findIndex()

_.flatten(array) 二维数组变成一位数组(减少一层嵌套),返回新数组

_.flatten([1, [2, [3, [4]], 5]]);
// => [1, 2, [3, [4]], 5]

_.flattenDeep(array) 扁平化处理数组(递归方法)多维数组改成一维数组

_.flattenDepth(array, [depth=1])根据depth,减少嵌套层数

_.fromPairs(pairs) 数组改成对象

_.fromPairs([['fred', 30], ['barney', 40]]);
// => { 'fred': 30, 'barney': 40 }

_.indexOf(array, value, [fromIndex=0])返回数组中第一个匹配的索引;fromIndex开始位置,负数时,反向开始查找,未找到返回-1

_.initial(array) 去掉最后一个元素,等同于_.dropRight(array)

_.join(array, [separator=',']) 分割数组,默认通过‘,‘逗号分隔

_.join(['a', 'b', 'c'], '~');
// => 'a~b~c'

_.nth(array, [n=0]) 返回元素,第二个参数为负数时,反向查找

_.pull(array, values)移除数组中所有与values相等的值

var array = [1, 2, 3, 1, 2, 3];

_.pull(array, 2, 3);
console.log(array);
// => [1, 1]

_.pullAll(array, [values]) 用法同_.pull(),第二个参数略有不同

_.pullAllBy(array, values, [iteratee=_.identity]) 迭代器

_.pullAllWith(array, values, [comparator]) 比较

_.remove(array, [predicate=_.identity])遍历数组array,返回符合条件的值,改变原数组

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]

_.reverse(array) 数组顺序反转