Lodash的使用

Lodash中文文档

 

Lodash，这是一个具有一致接口、模块化、高性能等特性的 JavaScript 工具库。

项目中使用：

import _ from 'lodash' 

来引入模块

项目中较常用到的方法有_.map()、_.reduce（）、_.filter()等方法

_.map(collection, [iteratee=_.identity])

创建一个数组， value（值） 是 iteratee（迭代函数）遍历 collection（集合）中的每个元素后返回的结果。 iteratee（迭代函数）调用3个参数： (value, index|key, collection). 通俗点讲就是通过变换函数（iteratee迭代器）把list中的每个值映射到一个新的数组中（注：产生一个新的数组）。

参数

1. collection (Array|Object): 用来迭代的集合。
2. [iteratee=_.identity] (Array|Function|Object|string): 每次迭代调用的函数。

返回

(Array): 返回新的映射后数组。

如：

const ECSSecurityGroupIdList = [{id:1,securityGroupId="test1"},{id:2,securityGroupId:"test3"}]
let dataSource = _.map(ECSSecurityGroupIdList, (item) => {
  return {
    value: item.SecurityGroupId,
    label: item.SecurityGroupName,
  };
});

例子：

function square(n) {
  return n * n;
}
 
_.map([4, 8], square);
// => [16, 64]
 
_.map({ 'a': 4, 'b': 8 }, square);
// => [16, 64] (无法保证遍历的顺序)
 
var users = [
  { 'user': 'barney' },
  { 'user': 'fred' }
];
 
// 使用了 `_.property` 的回调结果
_.map(users, 'user');
// => ['barney', 'fred']

_.assignIn(object, [sources])别名_.extend

参数

1. object (Object): 目标对象。
2. [sources] (...Object): 来源对象。

返回

(Object): 返回 object。

例子：

function Foo() {
  this.a = 1;
}
 
function Bar() {
  this.c = 3;
}
 
Foo.prototype.b = 2;
Bar.prototype.d = 4;
 
_.assignIn({ 'a': 0 }, new Foo, new Bar);
// => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }

_.extend({ 'a': 0 }, {'b':1});
// => { 'a': 1, 'b': 1}

_.reduce(collection, [iteratee=_.identity], [accumulator])

压缩 collection（集合）为一个值，通过 iteratee（迭代函数）遍历 collection（集合）中的每个元素，每次返回的值会作为下一次迭代使用(作为iteratee（迭代函数）的第一个参数使用)。 如果没有提供 accumulator，则 collection（集合）中的第一个元素作为初始值。(accumulator参数在第一次迭代的时候作为iteratee（迭代函数）第一个参数使用。) iteratee 调用4个参数：
(accumulator, value, index|key, collection). 

参数

1. collection (Array|Object): 用来迭代的集合。
2. [iteratee=_.identity] (Function): 每次迭代调用的函数。
3. [accumulator] (*): 初始值。

返回

(*): 返回累加后的值。

例子：

_.reduce([1, 2], function(sum, n) {
  return sum + n;
}, 0);
// => 3
 
_.reduce({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) {
  (result[value] || (result[value] = [])).push(key);
  return result;
}, {});
// => { '1': ['a', 'c'], '2': ['b'] } (无法保证遍历的顺序)

_.filter(collection, [predicate=_.identity])

遍历 collection（集合）元素，返回 predicate（断言函数）返回真值 的所有元素的数组。 predicate（断言函数）调用三个参数：(value, index|key, collection)。 

参数

1. collection (Array|Object): 一个用来迭代的集合。
2. [predicate=_.identity] (Array|Function|Object|string): 每次迭代调用的函数。

返回

(Array): 返回一个新的过滤后的数组。

var users = [
  { 'user': 'barney', 'age': 36, 'active': true },
  { 'user': 'fred',   'age': 40, 'active': false }
];
 
_.filter(users, function(o) { });
// => objects for ['fred']
 
_.filter(users, (o) => {return !o.active;});
// => objects for ['fred']

// The `_.matches` iteratee shorthand.
_.filter(users, { 'age': 36, 'active': true });
// => objects for ['barney']
 
// The `_.matchesProperty` iteratee shorthand.
_.filter(users, ['active', false]);
// => objects for ['fred']
 
// The `_.property` iteratee shorthand.
_.filter(users, 'active');
// => objects for ['barney']