darrenji

 

Lodash用来操作对象和集合,比Underscore拥有更多的功能和更好的性能。

官网:https://lodash.com/
引用:<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
安装:npm install lodash

首先通过npm安装lodash:
npm i --save lodash

在js文件中引用lodash:
var _ = require(\'lodash\');

 

本系列包括:

 

lodash用法系列(1),数组集合操作
lodash用法系列(2),处理对象 
lodash用法系列(3),使用函数 
lodash用法系列(4),使用Map/Reduce转换  
lodash用法系列(5),链式 
lodash用法系列(6),函数种种 



■ 遍历

【forEach】

_.forEach(collection, function(name){});
_.forEach(collection, function(name, index){})

 

■ 字符串排序

【sortBy】
【排序,字段字符串】

 

var strSortResult = _.sortBy(\'cda\').join(\' \');
console.log(strSortResult);

 

■ 根据数组元素的某个字段排序

● 在匿名函数中声明排序字段

【sortBy】
【排序,匿名函数】

 

var arr = [
  {name: \'aa\',age:22},
  {name: \'bb\',age:23}
];

var arrSortResult = _.sortBy(arr, function(item){
  return item.name;
})


_.forEach(arrSortResult, function(item){
  console.log(item.name);
});

 

● 通过字符串声明排序字段

_.sortBy(arr, \'name\');

● 通过字符串数组声明排序字段

【sortBy】
【排序,字段字符串数组】

_.sortBy(arr, [\'name\',\'age\']);

■ 向一个集合中插入某个元素而不改变固有的顺序

【sortedIndex】

 

var collection = [\'a\', \'b\', \'c\', \'d\', \'f\'];

console.log(\'before: \' + collection.join(\' \'));

//要插入的值
var toBeInserted = \'e\';

//要插入值再数组中的索引
var sortedIndex = _.sortedIndex(collection, toBeInserted);

//插入 splice中数组的指定索引位置插入元素,0表示有0个元数组元素删除
collection.splice(sortedIndex, 0, toBeInserted);

console.log(\'after:\' + collection.join(\' \'));

 

■ 通过where方法过滤集合,传入对象

【where】

 

var collection1 = [
  {name: \'aa\', age:20, gender: \'m\'},
  {name: \'bb\', age:21, gender: \'f\'},
  {name: \'cc\', age:22, gender: \'m\'}
];

var result1 = _.where(collection1, {age:20, gender:\'m\'});
_.forEach(result1, function(item){
  console.log(item.name);
});

 

■ 通过filter方法过滤集合,传入字符串

【filter】
【过滤,字段字符串】

 

var collection2=[
  {name: \'aa\', enabled: false},
  {name:\'bb\', enabled:true}
];

var result2 = _.filter(collection2, \'enabled\');
_.forEach(result2, function(item){
  console.log(item.name);
});

 

■ 通过filter方法过滤集合,传入匿名函数

【filter】
【过滤,匿名函数】

 

var collection3 = [
  {name: \'aa\', size: \'L\'},
  {name: \'bb\', size: \'M\'}
];

var result3 = _.filter(collection3, function(item){
  return item.size === \'L\';
});

_.forEach(result3, function(item){
  console.log(item.name);
});

 


■ 通过reject方法过滤到不需要的集合元素,传入对象

【reject】
【过滤不要的,过滤条件为对象】

 

var collection4 = [
  {name:\'soccer\', enabled: true},
  {name: \'basketball\', enabled: false}
];

var result4 = _.reject(collection4,{enabled:false});

_.forEach(result4, function(item){
  console.log(item.name);
});

 

■ 找到特定的元素

【find, findLast】
【搜寻,过滤条件为对象】

 

//只要找打一个就返回结果
_.find(collection, {age:20});

_.findLast(collection,{age:20});

 

■ 从前到后从数组中获取一些

【take】
【数组,获取一些】

 

var array = [];
_.take(array, 2);

 


■ 从前到后从字符串中获取一些

【take】
【字符串,获取一些】

 

_.take(\'hello\',2).join(\' \');

 

■ 从后到前从数组中获取一些

【takeRight】
【数组,获取一些,从后面开始】

 

var arr = [];
_.takeRight(array, 2);

 

■ 从后到前从字符串中获取一些

【takeRight】
【字符串,获取一些,从后面开始】

 

_.takeRight(\'hello\', 2).join(\' \');

 

■ 把大数据分成多份分批处理

【chunks,isUndefined,last,defer,partial】

 

var collection1 = _.range(10000),
  chunks = _.chunk(collection1,50);//每一份50个,总共分为20份

//处理chunks,无限递归
function process(chunks, index){
  //找到需要被处理的chunk
  var chunk = chunks[index];

  //判断chunk是否为undefined
  if(_.isUndefined(chunk)){
    return;
  }

  console.log(\'working \' + _.last(chunk));

  //defer让堆栈上有足够的时间作清理,defer接受一个回调函数
  //partial让某个函数执行
  _.defer(_.partial(process, chunks, ++index));
}

process(chunks,0);

 

以上,使用range方法生成了一个比较大的集合,再使用chunk方法分隔成多份。使用process无限递归处理完所有的份数。

还可以根据集合长度来进行份数划分。

 

var collection _.range(10),
    size = Math.ceil(0.25 * collection.length);
_.chunk(collection, size);

 

■ 去除集合中的重复部分

【uniq】

 

/去除字符串数组中的重复部分
var collection = [\'\',\'\'];
_.uniq(collection);

//uniq接受匿名函数
var collection = [
    {firstName: \'\', lastName: \'\'},
    ...
];
_.uniq(collection, function(item){
    return item.firstName + item.lastName;
})

 

■ 根据对象字段分组

【groupBy】
【分组,根据字段】

 

var collection = [
    {name:\'\',size:\'\'},
    ...
];
_.groupBy(collection, \'size\');

 


■ 根据匿名函数分组

【groupBy】
【分组,根据匿名函数】

 

var collection = [
    {name: \'\', age:20},
    ...
];

_.groupBy(collection, function(item){
    return item.age > 20 ? \'old\' : \'young\';
})

 

■ 获取最小,根据字段

【min】

_.min(collectin, \'age\');

■ 获取最大,根据匿名函数

【max】
【最大值,根据匿名函数】

 

_.max(collecion, function(item){
    return item.age + item.workinghours;
})

 


■ 获取集合大小

【size】

 

var collection = [
    {name: \'\'},
    ...
];

var first = _.first(collection);
_.size(collection);
_.size(first.name);//获取字符串的长度

 

■ 提取嵌套集合中的有用部分

【pluck,flatten】

以下想获取所有集合元素中的employees下的所有对象,即[ { name: \'b\' }, { name: \'c\' }, { name: \'e\' }, { name: \'f\' } ]。

第一步通过pluck方法获取[ [ { name: \'b\' }, { name: \'c\' } ],[ { name: \'e\' }, { name: \'f\' } ] ]。

第二步通过flatten方法获取想要的结果。

 

var collection = [
  {employer: \'a\', employees: [{name:\'b\'},{name:\'c\'}]},
  {employer: \'d\', employees: [{name:\'e\'},{name:\'f\'}]}
];

//pluck找出符合条件的字段,
//[ [ { name: \'b\' }, { name: \'c\' } ],[ { name: \'e\' }, { name: \'f\' } ] ]
var tempResult = _.pluck(collection, \'employees\');
console.log(tempResult);

//[ { name: \'b\' }, { name: \'c\' }, { name: \'e\' }, { name: \'f\' } ]
var employees = _.flatten(tempResult);
console.log(employees);

var result = _.filter(employees, function(item){
  return (/^[bx]/i).test(item.name);//找出name值以b或x开头的
});

console.log(result);

 

另外,falttenDeep方法可以使多层嵌套扁平化成一层。

■ 去除集合中的无效元素,比如null, 0, undefined等。

【compact】

 

var collection = [
  {name: \'aa\'},
  0,
  {name: \'bb\'},
  null,
  {name:\'cc\'},
  undefined,
  {name:\'dd\'}
];

var letters = [\'a\', \'b\'],//过滤条件
  compactResult = _.compact(collection),
  result = [];

//遍历打印
_.forEach(compactResult, function(item){
  console.log(item.name);
});

//操作某个元素
_.each(letters, function(letter){
  var filterResult = _.filter(compactResult, function(item){
    return _.startsWith(item.name.toLowerCase(), letter);
  });

  //合并数组
  result = result.concat(filterResult);
});

//[ { name: \'aa\' }, { name: \'bb\' } ]
console.log(result);

 


■ 去除集合中不符合某种规律的元素

【pluck, compact, startsWith】

以下,除去不包含name字段的集合元素。

 

var collection = [
    {name: \'a\'},
    {name: \'b\'},
    {name: \'c\'},
    {},
    true,
    1
];

//先筛选出包含name字段的值,不包含的显示undefined
var pluckResult = _.pluck(collection, \'name\');

//[ \'a\', \'b\', \'c\', undefined, undefined, undefined ]
console.log(pluckResult);


var letters = [\'a\', \'b\'],
    //再去除undefined
    compactResult = _.compact(pluckResult),
    result = [];

//[ \'a\', \'b\', \'c\' ]
console.log(compactResult);

_.each(letters, function(letter){
   var filterResult = _.filter(compactResult, function(item){
      return _.startsWith(item.toLowerCase(), letter);
   });

    result = result.concat(filterResult);
});

console.log(result);

 

■ 所有集合元素满足条件或部分集合元素满足条件

【every】

判断所有集合元素哟啊满足某种条件。

 

var _ = require(\'lodash\');

var collection = [
    {name: \'a\'},
    {name: \'b\'},
    {name: \'c\'}
];

if(!_.every(collection, \'name\')){
    console.log("有集合元素不包含name字段");
}

 

判断部分集合元素满足条件。

 

_.some(collection, \'name\')

■ 并集、交集、补集

【union, interseciton, xor】

 

var a = [];
var b = [];
var c = [];

_.union(a, b, c);
_.intersection(a, b, c);
_.xor(a, b);

 

参考资料:lodash essentials

 

未完待续~~

 

分类:

技术点:

相关文章:

  • 2021-06-30
  • 2021-05-31
  • 2021-08-24
  • 2022-02-06
  • 2022-01-11
  • 2021-11-28
  • 2021-11-27
  • 2022-01-08
猜你喜欢
  • 2021-05-19
  • 2021-08-07
  • 2022-02-19
  • 2021-10-16
  • 2022-12-23
  • 2021-09-24
  • 2021-11-04
相关资源
相似解决方案