Lodash

lodash 简介

lodash是一套工具库，它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数。中文文档在此。

模块组成

• Lodash 提供的辅助函数主要分为以下几类：
• Array，适用于数组类型，比如填充数据、查找元素、数组分片等操作
• Collection，适用于数组和对象类型，部分适用于字符串，比如分组、查找、过滤等操作
• Function，适用于函数类型，比如节流、延迟、缓存、设置钩子等操作
• Lang，普遍适用于各种类型，常用于执行类型判断和类型转换
• Math，适用于数值类型，常用于执行数学运算
• Number，适用于生成随机数，比较数值与数值区间的关系
• Object，适用于对象类型，常用于对象的创建、扩展、类型转换、检索、集合等操作
• Seq，常用于创建链式调用，提高执行性能（惰性计算）
• String，适用于字符串类型

常用的方法

• times：循环N次

_.times(5, function(){
    // ...
});

• cloneDeep：深度克隆JavaScript对象

var objB = _.cloneDeep(objA);

• random：在指定范围内获取一个随机值

_.random(20); // 返回 0 到 20的随机数
_.random(15, 20, true); // 返回 15 到 20的浮点型随机数;

• assign：扩展对象

var objA = {"name": "colin", "car": "suzuki"};
var objB = {"name": "james", "age": 17};

_.assign(objA, objB););

• omit：从对象中删除属性

var objA = {"name": "colin", "car": "suzuki", "age": 17};
bjA = _.omit(objA, ['car', 'age']); // {"name": "colin"}

• forEach：对集合中的元素进行遍历，调 用function （迭代函数）遍历 collection中的每个元素，function如果显式的返回 false ，迭代会提前退出。

_.forEach(collection, function (value, index, collection){})

• map: 创建一个数组，value（值） 是 function（迭代函数）遍历 collection中的每个元素后返回的结果。某次迭代的返回值可能是null

_.map(collection, function (value, index, collection){})

• find: 返回 function（断言函数）第一个返回真值的第一个元素。如果没有匹配元素返回undefined

_.find(collection, function (value, index, collection){})

var users = [
  { 'user': 'barney',  'age': 36, 'active': true },
  { 'user': 'fred',    'age': 40, 'active': false },
  { 'user': 'pebbles', 'age': 1,  'active': true }
];

_.find(users, function(o) { return o.age < 40; });
// => object for 'barney'

_.find(users, { 'age': 1, 'active': true });
// => object for 'pebbles'

_.find(users, 'active');

// => object for 'barney'

• findIndex： 类似find，区别是该方法返回第一个通过 predicate 判断为真值的元素的索引值（index），而不是元素本身。如果没有匹配元素返回-1

_.findIndex(collection, function (value, index, collection){})

• filter: 返回predicate（断言函数）返回真值 的所有元素的数组，返回值是一个新的过滤后的数组（浅拷贝）， 不会改变原数组

_.filter(collection, function (value, index, collection){})

var users = [
  { 'user': 'barney', 'age': 36, 'active': true },
  { 'user': 'fred',   'age': 40, 'active': false }
];

_.filter(users, function(o) { return !o.active; });
// => objects for ['fred']

_.filter(users, ['active', false]);
// => objects for ['fred']

• every: 通过 predicate（断言函数） 检查 collection（集合）中的 所有 元素是否都返回真值。如果都返回真值则函数最终返回true，否则返回false。
  

  注意：这个方法对于对于空集合返回 true，因为空集合的任何元素都是 true 。

_.every(collection, function (value, index, collection){})

_.every([true, 1, null, 'yes'], Boolean);
// => false

• some: 通过 predicate（断言函数） 检查collection（集合）中的元素是否存在 任意 truthy（真值）的元素，一旦 predicate（断言函数） 返回 truthy（真值），遍历就停止, 返回true，否则返回false

_.some(collection, function (value, index, collection){})

_.some([null, 0, 'yes', false], Boolean);
// => true

• remove：移除数组中predicate（断言）返回为真值的所有元素，并返回移除元素组成的数组。这个方法会改变数组 array

_.remove(collection, function (value, index, collection){})

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]

• join： 将array中所有元素用separator 分隔符连接，返回该字符串

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

• flatten：减少一级array的维度

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

• flattenDeep：将array递归为一维数组

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

• flattenDepth：根据 depth 递归减少 array 的嵌套层级

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

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

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

• sortBy：数组排序，这个方法执行稳定排序，相同元素会保持原始排序。

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 36 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 34 }
];

_.sortBy(users, function(o) { return o.user; });
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

_.sortBy(users, ['user', 'age']);
// => objects for [['barney', 34], ['barney', 36], ['fred', 40], ['fred', 48]]

• orderBy：类似于_.sortBy，除了增加了一个参数orders指定）结果如何排序。指定为”desc” 降序，或者指定为 “asc” 升序，默认为asc。

var users = [
  { 'user': 'fred',   'age': 48 },
  { 'user': 'barney', 'age': 34 },
  { 'user': 'fred',   'age': 40 },
  { 'user': 'barney', 'age': 36 }
];

// 以 `user` 升序排序 再  `age` 以降序排序。
_.orderBy(users, ['user', 'age'], ['asc', 'desc']);
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]

• reverse：反转array， 会改变原数组

var array = [1, 2, 3];

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

• uniq：数组去重

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

• uniqBy：类似 _.uniq ，除了它接受一个 iteratee （迭代函数），根据函数执行结果进行去重

_.uniqBy(collection, function (value){})

_.uniqBy([2.1, 1.2, 2.3], Math.floor);
// => [2.1, 1.2]

• forIn：遍历对象的自身和继承的可枚举属性。返回值是一个object，如果返回 false，iteratee 会提前退出遍历。

function Foo() {
  this.a = 1;
  this.b = 2;
}

Foo.prototype.c = 3;

_.forIn(new Foo, function(value, key) {
  console.log(key);
});
// => Logs 'a', 'b', then 'c' (无法保证遍历的顺序)。

• chain：创建链式调用，解除链式调用并返回值使用value方法

var users = [
  { 'user': 'barney',  'age': 36 },
  { 'user': 'fred',    'age': 40 },
  { 'user': 'pebbles', 'age': 1 }
];

var youngest = _
  .chain(users)
  .sortBy('age')
  .map(function(o) {
    return o.user + ' is ' + o.age;
  })
  .head() //获取数组 array 的第一个元素。
  .value();

• _.defer(func, [args]): 推迟调用func，直到当前堆栈清理完毕。 调用时，任何附加的参数会传给func。

_.defer(func, [args])

_.defer(function(stamp) {
  console.log(_.now() - stamp);
}, _.now());
// => 记录延迟函数调用的毫秒数

• delay：延迟 wait 毫秒后调用 func。 调用时，任何附加的参数会传给func。

_.delay(function(text) {
  console.log(text);
}, 1000, 'later');
// => 一秒后输出 'later'。

ES6替代

ES6里面有一些特性可以直接替代将lodash的方法：

• Map, find, filter, some, every, forEach：这些集合方法使数据转化变得轻而易举。

 var test = array.map(function (value) {
   return value.id + 10000
 });

• head, tail：解构语法 让我们可以获取一个列表的头（head）和尾（tail），而无需工具函数。

_.head([1, 2, 3]);
// 1
_.tail([1, 2, 3]);
// [2, 3]

// 变为

const [head, ...tail] = [1, 2, 3];

更多见这篇文章。

参考

• http://www.jianshu.com/p/7436e40ac5d1
• http://www.css88.com/doc/lodash/
• http://www.zcfy.cc/article/10-lodash-features-you-can-replace-with-es6-467.html