lodash和Underscore介绍

Lodash 和 Underscore 是非常优秀的当代JavaScript的工具集合框架,它们被前端开发者广泛地使用。

如官方所介绍的那样,Lodash是一个具有一致接口、模块化、高性能的JavaScript工具库。一开始Lodash只是Underscore.js的一个fork,之后再原有的成功基础上取得了更大的成果,lodash的性能远远的超过了Underscore。因此,很多模块放弃了Underscore转入Lodash的怀抱。目前,lodash是npm仓库中依赖最多的库。使用lodash的全部函数需要使用全局的_就像是使用jQuery的函数前加上全局的$一样。lodash的使用极大的减少了你的代码量以及编写代码时间。

[附上lodash的API文档](http://lodashjs.com/docs/) ]

接下来,展示一些简单的用法。

循环

// 典型的循环写法
for(let i = 0;i < 5;i++){
  //todo
}
 
// lodash写法
_.times(5,()=>{
  //todo
})

过滤

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

 

直接通过一个函数删选掉所有假值的数据,比寻常的遍历更加方便。

var arr1 = [1,2,3,4]
var arr2 = _.remove(arr1,(n) => {
  return n%2 == 0
})
 
//arr1 => [1,3]
//arr2 => [2,4]

通过_.remove() 的方法删选出了符合条件的数组元素,并构成一个新数组,同时对原数组进行了去除改元素的操作。

迭代

var arr = [{
  name: 'linge',
  son: [{name: 'liu'},{name: 'chen'}]
},{
  name: 'huangxiaoshu',
  son: [{name: 'diao'},{name: 'xu'}]
}]
 
_.map(arr,'name')  //['linge','huangxiaoshu']
_.map(arr,'son[0].name')  //['liu','diao']

lodash中map的方法也是异常强大,它即可以用_.map(arr,()=>{//todo}) 如同原生js的形式对数组进行迭代,另外lodash中map方法能够遍历深度嵌套的对象属性,这一点在实际开发的时候是非常有用的。

对象扩展

//Lodash
_.assign({name: 'shidiao',age: 38},{sex: 'famale'},{name: 'liushitao'})
//ES6新增函数
Object.assign({name: 'shidiao',age: 38},{sex: 'famale'},{name: 'liushitao'})
//{name: 'liushitao',age: 38,sex: 'female'}

odash中的_.assign只是浅拷贝,这与ES6新增的函数Object.assign功能重复了。

深度克隆
个人认为深度克隆是lodash里面最好用的函数之一。众所周知,深度克隆JavaScript对象是挺麻烦的事情,但是lodash一个简简单单的_.cloneDeep方法帮你完成了繁琐的深度克隆操作,使用_.clone(obj,true)也能起到相同的作用,但是_.clone能够指定深度克隆的层级。

var obj = {
  name: 'linge',
  son: [{name: 'liu'},{name: 'chen'}]
};
var deep = _.cloneDeep(obj);
obj === deep //false

删选对象属性

var obj = {
  name: 'linge',
  age: 20
}
 
_.omit(obj, 'age')  // {name: 'linge'}

这个方法在实际的开发项目中也相当实用,值得注意的是_.omit返回了一个新的数组,并不改变原数组。与_.omit相反_.pick方法可以挑选出指定的属性,组成一个新数组。

总结
总的来说,lodash还是非常实用的,它让代码看上去更加精简,不至于很臃肿,提高了代码的可读性以及逻辑性。虽然部分的方法以及可以被ES6的新方法进行代替,但丝毫掩盖不了它的价值。

 

参考文章:

https://segmentfault.com/a/1190000004460234

https://blog.csdn.net/lyz_linge/article/details/78217683

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值