学习lodash——这一篇就够用
在ES6盛行,ES78马上就要出来的情况下;我们还是需要懂得一些工具库的使用,比较推荐的是lodash。
在下面就会谈一谈为什么要使用lodash和lodash的基本使用。
首先要明白的是lodash的所有函数都不会在原有的数据上进行操作,而是复制出一个新的数据而不改变原有数据。类似immutable.js的理念去处理。
lodash是一套工具库,内部封装了很多字符串、数组、对象等常见数据类型的处理函数。
lodash的引用
import _ from 'lodash'
用一个数组遍历来说明为什么要使用lodash
常规数组遍历
agent.forEach(function (n,key) {agent[key].agent_id = agent[key].agent_name;return agent;
})
使用lodash来遍历
_.forEach(agent,function(n,key) {
agent[key].agent_id= agent[key].agent_name
})
这是一个常见的forEach的数组遍历,使用了lodash过后,_.forEach()这是一个值,而不是一个函数。就可以直接
const arr = _.forEach();
这时候arr就是新的数组agent。而在常规的js数组遍历中,还需要考虑return的值和this的指向问题。虽然这样看起来,二者相差不大,但是在实际的开发过程中,熟练的使用lodash能大大的提高开发的效率。
再来总结一些lodash常用函数(还是推荐大家能去官网把所有的函数看一遍增加一些印象)
1.chunk,将数组进行切分。(也是官网的第一个函数)
const arr = [1,2,3,4,5,6,7,8,9];
_.chunk(arr,2);
// =>[[1,2],[3,4],[5,6],[7,8],[9]]
这个函数把数组按照一定的长度分开,返回新的数组。(片段化数组)
2.compact,去除假值。(将所有的空值,0,NaN过滤掉)
_.compact(['1','2',' ',0])
// => ['1','2']
对应的还有一个数组去重函数,这在实际的开发中很有作用。
3.uniq,数组去重。(将数组中的对象去重,只能是数组去重,不能是对象去重。)
_.uniq([1,1,3])
// => [1,3]
这跟介绍的第二个函数compact有很好的配合作用。(后端接口传来的数据很多是有重复或者空值的,这时候就可以使用两个函数来过滤数据。ladash只是最基础的库,其实可以将几个函数封装起来组件自己的库。)
4.filter和reject,过滤集合,传入匿名函数。(二者放在一起讨论的原因是,两个函数类似但返回的值是相反。)
_.filter([1,2],x => x = 1)
// => [1]_.reject([1,2],x => x=1)
// => [2]
这两个过滤器,第二个参数值是false的时候返回是reject的功能,相反是true的时候是filter。
5.map和forEach,数组遍历。(相似)
如果不明白map和forEach有什么相似的可以百度一下,简单说一下不同点就是,map的回调函数中是支持return返回值的。
不过二者都不改变原来的数组。
_.map([1,2],x => x+1)
// => [2,3]
推荐使用map。
6.merge,参数合并。(merge函数像是Git的merge分支操作一样,将两个参数合并在一起。)
官网的解释是,递归的将源对象和继承的可枚举字符串监控属性合并到目标对象中。源对象从左到右引用,后续来源将覆盖以前来源的属性分配。
var object = {'a': [{ 'b': 2 }, { 'd': 4 }]
};var other = {'a': [{ 'c': 3 }, { 'e': 5 }]
};_.merge(object, other);
// => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
这里就像借用官网的代码来解释一下了。在实际开发中,前端在接口的请求可以merge一下之前的query和现在改变的查询的值,再去请求后端接口的数据。
7.extend,类似参数对象合并。
function Foo() {this.a = 1;
}function Bar() {this.c = 3;
}Foo.prototype.b = 2;
Bar.prototype.d = 4;_.assignIn({ 'a': 0 }, new Foo, new Bar);
// => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
8.cancat,数组连接
var array = [1];
var other = _.concat(array, 2, [3], [[4]]);console.log(other);
// => [1, 2, 3, [4]]console.log(array);
// => [1]
可以接受多个参数,将多个参数合并为一个数组元素。
9.keys ,取出对象中所有的key值组成新的数组。
function Foo() {this.a = 1;this.b = 2;
}Foo.prototype.c = 3;_.keys(new Foo);
// => ['a', 'b'] (iteration order is not guaranteed)_.keys('hi');
// => ['0', '1']
类似object.keys(),返回对象中可枚举属性的数组。
待更新...
以上都是个人总结出来的,肯定也有不对的地方,欢迎交流指点,互相学习。
学习lodash——这一篇就够用相关推荐
- 一篇就够用了——深度学习Ubuntu16.04环境配置+Win10双系统
一篇就够用了深度学习Ubuntu16.04环境配置 必看!此教程使用说明 [必备配置]基本环境配置 1.win10+ubuntu16.04双系统安装 2.ubuntu最重要的事--切换下载源 3.ub ...
- 学习MyBatis3这一篇就够了
目录 第一章 MyBatis3概述 1.1.概述 1.2.特点 1.3.对比 1.4.官网 1.5.下载 第二章 MyBatis3的增删改查 2.1.环境准备 2.2.创建工程 2.3.导入依赖 2. ...
- CSS——CSS基础(一篇就够用)
CSS--CSS基础(一篇就够用) 一.CSS概述 1.什么是css 2.作用 3.css和html属性的使用原则 二.CSS语法规范 1.css的使用方式 ①行内样式,内联样式 ②内部样式 ③外部样 ...
- 高三学习计划作文计算机专业,制定计算机学习计划范文3篇
学习计划是学习内容.学习时间及学习方法等诸方面因素的有机融合,通常具有致力于发展学习过程中的薄弱环节.巩固学习优势等功用.本文是学习啦小编为大家整理的制定计算机学习计划的范文,仅供参考. 制定计算机学 ...
- OracleDesigner学习笔记1――安装篇
OracleDesigner学习笔记1――安装篇 QQ:King MSN:qiutianwh@msn.com Email:qqking@gmail.com 一. 前言 Oracle是当 ...
- 深度学习的150多篇文章和10多个专栏推荐
文章首发于微信公众号<有三AI> 创业第一天,有三AI扔出了深度学习的150多篇文章和10多个专栏 文/编辑 | 言有三 在这篇文章中,有三跟大家来聊一下有三AI和如何学习深度学习这件事儿 ...
- Hadoop学习笔记—15.HBase框架学习(基础知识篇)
Hadoop学习笔记-15.HBase框架学习(基础知识篇) HBase是Apache Hadoop的数据库,能够对大型数据提供随机.实时的读写访问.HBase的目标是存储并处理大型的数据.HBase ...
- android 界面组件,安卓开发学习周第三篇——Android中的UI组件
原标题:安卓开发学习周第三篇--Android中的UI组件 在Android APP中,所有的用户界面元素都是由View和ViewGroup的对象构成的.View是绘制在屏幕上的用户能与之交互的一个对 ...
- Python学习---入门导学篇
Python学习---入门导学篇 Python的特点 Python受人喜欢的原因 Python的缺点 Python能做什么? Python基础语法 Python的特点 1.Python是一门编程语言, ...
最新文章
- jenkins运行日志时间与linux,Jenkins 用户文档(运行多个步骤)
- php定时任务为什么不好写,php解决crontab定时任务不能写入文件问题的方法分析...
- RMSD:通过旋转计算两个分子间的最小rmsd
- 内核网络中的GRO、RFS、RPS技术介绍和调优
- 填补商用安全产品空白 山石云安全升级版本亮相OpenStack Days
- (C/C++学习)15.C语言字符串和字符数组
- 北京严厉打击违规发布网络房源信息行为 18家机构被查处
- CircularFifoQueue队列API
- 简单的代码提交,还能玩出这么多花样?
- Bootstrap3.0学习第十一轮(输入框组)
- FFmpeg简介及常见用法
- go tool vet是你的好朋友
- Ubuntu14下安装使用SVN RabbitVCS客户端
- 无线路由器怎么显示远端服务器,路由器远端服务器无响应是怎么回事
- 笔记本安装系统不认硬盘?
- SpringBoot整合阿里云视频点播
- Python爬取百度文库并存储为word文档
- SOP是什么?SOP的作用是什么?如何编写SOP?
- hook函数教程(一)什么是钩子
- Delphi 取得 iOS 辅助使用里的字型大小