Lodash.js:实用的工具库

Lodash.js:实用的工具库

如官方所介绍的那样,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
})

相比较,lodash的写法更为简洁,更加的直观易用。

过滤

_.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'}

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

个人建议优先使用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

另外分享一篇文章深入剖析JavaScript的深复制

删选对象属性

var obj = {
  name: 'linge',
  age: 20
}

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

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

总结

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

本文同步自个人小站,欢迎点击

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: lodash.js是一个流行的JavaScript工具,提供了许多实用的函数和方法,用于简化JavaScript编程的复杂性。如果你想要下载lodash.js,你可以采取以下几种方式: 1. 官方网站:你可以直接访问lodash.js的官方网站(https://lodash.com/)下载最新版本的lodash.js。在官方网站上,你可以找到针对不同需求的不同构建版本,包括完整版、核心版和按需版本。你只需点击相应的下载链接,即可将lodash.js下载到本地。 2. npm包管理工具:作为一个流行的npm包,你可以使用npm命令来下载lodash.js。首先,在你的项目文件夹中打开终端或命令提示符窗口,运行以下命令安装lodash.js: ``` npm install lodash ``` 这将自动下载并安装最新版本的lodash.js到你的项目中。 3. CDN:如果你只想暂时使用lodash.js而不想下载到本地,你可以使用CDN(内容分发网络)来引用lodash.js。一些常见的CDN提供商,如cdnjs、unpkg等,都提供了lodash.js的链接。你可以将这些链接直接复制到你的HTML文件中的`<script>`标签中,从而引入lodash.js。 无论你选择哪种方式,一旦你成功下载了lodash.js,你就可以在你的项目中引用它,并使用其中的函数和方法来简化你的JavaScript编程工作。 ### 回答2: lodash.js 是一个 JavaScript ,提供了一组实用的函数,旨在简化处理数组、对象、字符串、函数等常见数据类型的操作。 要下载 lodash.js,可以按照以下步骤进行: 1. 打开 lodash.js 的官方网站(https://lodash.com/)。 2. 在页面中找到并点击 "Download"(下载) 按钮。 3. 在下载页面中,选择适合的版本和格式。 4. 如果你使用 npm(Node.js 包管理器),可以通过在终端或命令提示符中运行以下命令来安装 lodash: ``` npm install lodash ``` 5. 如果你在浏览器中使用 lodash,可以直接下载 lodash.js 文件,并将其引入你的网页中。点击下载链接,保存 lodash.js 文件到你的项目目录。 6. 在你的 HTML 文件中,使用 `<script>` 标签将 lodash.js 引入: ```html <script src="path/to/lodash.js"></script> ``` 其中 `path/to/lodash.js` 是你刚才下载 lodash.js 文件的路径。 现在,你就可以在你的项目中使用 lodash.js 提供的函数了。引入了 lodash.js 之后,可以通过 `_.`(underscore 是 lodash.js 的函数别名)来调用中的函数。 例如,你可以使用 `_.forEach` 函数来遍历一个数组: ```javascript _.forEach([1, 2, 3], function(value) { console.log(value); }); ``` 总之,下载 lodash.js 主要有两种方式:通过 npm 安装到你的项目中,或者直接下载 lodash.js 文件并在你的网页中引入。然后,你就可以愉快地使用 lodash.js 提供的实用函数来简化你的 JavaScript 编程。 ### 回答3: lodash.js是一个JavaScript的实用工具,提供了许多常用的功能函数,可以简化开发过程中的操作。要下载lodash.js,可以采取以下步骤: 第一步,打开lodash.js的官方网站。可以通过搜索引擎搜索"lodash.js",找到官方网站的链接。 第二步,进入官方网站后,可以在网站上找到下载选项。一般来说,会有多个版本可供选择,包括编译后的版本和源代码版本。 第三步,选择需要下载的版本。编译后的版本适合直接在浏览器端使用,而源代码版本则可以进行自定义修改。根据自己的需求选择相应的版本。 第四步,完成版本选择后,点击下载链接。根据网速的不同,下载时间会有所不同。 第五步,下载完成后,将lodash.js文件保存到项目目录中的合适位置。可以根据自己的项目需求来确定所保存的路径。 第六步,将lodash.js引入到项目中的HTML文件中。可以使用<script>标签来引入,通过指定文件路径来将lodash.js加载到HTML中。 最后,将lodash.js成功下载并引入到项目中后,就可以在JavaScript代码中使用lodash.js提供的各种实用功能函数了,从而简化开发过程,提高开发效率。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值