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
lodash和Underscore介绍相关推荐
- Underscore和lodash 介绍
Lodash 和 Underscore 是非常优秀的当代JavaScript的工具集合框架,它们被前端开发者广泛地使用. 如官方所介绍的那样,Lodash是一个具有一致接口.模块化.高性能的JavaS ...
- Lodash.js:实用的工具库
Lodash.js:实用的工具库 如官方所介绍的那样,Lodash是一个具有一致接口.模块化.高性能的JavaScript工具库.一开始Lodash只是Underscore.js的一个fork,之后再 ...
- Javascript防抖函数节流函数的介绍(最详细)、彻底搞懂防抖节流的区别以及使用第三方库的防抖节流函数
文章目录 1.防抖节流函数介绍 1.1 认识防抖节流函数 1.2 认识防抖函数 1.3 防抖函数应用 1.4 认识节流函数 1.5 节流函数应用 1.6 生活中的例子 2.Underscore库 2. ...
- 学习 lodash 源码整体架构,打造属于自己的函数式编程类库
前言 这是 学习源码整体架构系列第三篇.整体架构这词语好像有点大,姑且就算是源码整体结构吧,主要就是学习是代码整体结构,不深究其他不是主线的具体函数的实现.文章学习的是打包整合后的代码,不是实际仓库中 ...
- Underscore.js-精巧而强大实用功能库
前言 从其他语言转向Javascript时,通常都会遇到一些困惑性问题.比如,Java中的HashMap在Javascript中如何实现?Javascript面向对象式编程如何实现继承?如何实现通用的 ...
- Underscore使用方法
从其他语言转向Javascript时,通常都会遇到一些困惑性问题.比如,Java中的HashMap在Javascript中如何实现?Javascript面向对象式编程如何实现继承?如何实现通用的ite ...
- underscore入门使用说明
underscore介绍: JavaScript的第三方库,提供函数式编程接口,通过统一的函数对Array和object进行map.filter等操作,消除了不同浏览器之间DOM操作的差异. 可以在官 ...
- lodash和下划线之间的差异[关闭]
本文翻译自:Differences between lodash and underscore [closed] Why would someone prefer either the lodash. ...
- 为什么 JavaScript 的私有属性使用 # 符号
这几天 JavaScript 的私有属性又成为了前端社区热议的话题.原因很简单,这家伙长这样: 惊不惊喜!意不意外! 而且 TC39 委员会以及对此达成了一致意见,并且该提案已经进入了 stage 3 ...
最新文章
- 14. Popen类
- 如何用python进行相关性分析_如何在python中检查连续变量和分类变量之间的相关性?...
- java基础----集合之Map集合基本方法的使用以及遍历
- 计算机操作系统课后题答案第三章,计算机操作系统教程习题与实验指导(第3版)...
- 前端笔记-vue cli引入sementic-ui(sementic-ui-vue)
- debian9.4配置iso作为更新源
- 密钥短语密码加密,解密同理。
- 谷歌卫星地图下载器与万能地图下载器功能比较
- Gram 矩阵及其主要性质
- html5颜色选择按钮,H5的input color系统颜色选择器
- 蓝光护目镜 v6.66.6.3
- 在香港用什么软件可以唱歌?香港K歌app推荐
- 使用中文维基百科进行GloVe实验
- Gmail企业级邮箱的outlook配置
- 派对屋3000效果器怎样调试_卡拉OK前级效果器如何调试?
- 给北上奋进的你一份礼物(java面试知识储备攻略)
- 一块宝藏存储芯片【SD NAND】
- [HTML5]简单网页本地音乐播放器
- 3D Vision Rebuttal
- 那些年遇到的奇葩老板