lodash入门使用

最新推荐文章于 2025-03-23 12:33:56 发布

reffrselom

最新推荐文章于 2025-03-23 12:33:56 发布

阅读量645

点赞数

分类专栏：前端

本文链接：https://blog.youkuaiyun.com/reffrselom/article/details/103678846

版权

本文介绍了lodash这个JavaScript库，包括times循环、chunk数组切分、compact去除假值、uniq数组去重、filter/reject过滤、map/forEach操作、merge/extend对象合并、concat数组连接、keys获取对象键、cloneDeep深拷贝、find/findIndex查找元素、last/nth获取指定元素、take获取前n个元素、pick提取对象属性和zip数组分组等常见功能。通过实例展示了lodash如何提高开发效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

之前有常看到lodash，但是一直没有详细了解，也没有用，现在有时间可以认真看下了。
好多东西都是，没了解没入门都会觉得应该不会那么容易上手，然后就暂时放置，然后安于原来熟悉的开发方式了，还是一个字 —— 懒。
可能尝试一件新事物并没有想象中那么地花费时间和精力，
坚持一个好的习惯也没有想象中那么的艰难~
———————————————————————————————————————————————
lodash是一个旨在提高开发效率和javascript原生方法性能的js原生库，像jquery一样，这里封装了很多字符串、数组、对象等常见数据类型的处理函数。
以下列举以下平时应用场景较多的几种，方便后期用到：
详细参考：lodash官网

1.times循环

//js原生的循环方法
   for (var i = 0; i < 5; i++) {
   
      console.log(i);
   };
        
//ladash的times方法
  this.$lodash.times(5,function (item) {
   
      console.log(item);
  })

2.chunk - 切分数组

将数组按照一定长度切分，返回新数组

 const arr = [1,2,3,4,5,6,7,8,9];
 let newArr = _.chunk(arr,2);
 console.log(newArr);
 // =>[[1,2],[3,4],[5,6],[7,8],[9]]

3.compact，去除假值。

将所有的空值，0，NaN过滤掉

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

4.uniq，数组去重

将数组中的对象去重，只能是数组去重，不能是对象去重。

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

5.filter和reject

过滤集合，传入匿名函数。（两个函数类似但返回的值是相反）

//返回满足条件项
_.filter([1,2],x => x = 1)
// => [1]
//返回不满足条件项
_.reject([1,2],x => x=1)
// => [2]

6.map和forEach

//这里也对比下原生map和forEach的区别(map可做返回值操作)
let newArr1 = [1,2].map(function(item,index,arr)

最低0.47元/天解锁文章