• 前言:

lodash是一个具有一致接口、模块化、高性能等特性的JavaScript工具库(官网地址:http://lodashjs.com/docs/#_differencearray-values)。

  • 过程:

接触js也已经有一年多的时间了,那天无意间从大神同事那里听到这个性能更好的工具,终于抽出时间看看它的文档,竟然有了意想不到的收获:之前在项目中总是遇到关于数组的各种处理,比如合并数组去重什么的,现在只要一行代码便可完美解决,真是有点小激动!话不多说,直接说过程:

1.它的安装方法很多种,官网上有很详细的介绍,于是就不重复介绍了,只是分享自己用到的吧!

1)用在node.js环境下:

npm i lodash –-save

2)用在HTML中:

<script src="lodash.js"></script>

注意:关于在浏览器中用到lodash文件的引用问题,只有在引入lodash.min.js后,lodash才会正常使用;而其他版本的,皆会报“ Uncaught TypeError: _.difference is not a function”的错误,原因就在于里面没有difference方法,至于为什么没有,那就不得而知了。

3)csdn下:(https://www.jsdelivr.com/projects/lodash

从上面的网址中可以自行选择需要的lodash版本。

2.接着,就来看看在lodash中的收获吧(都是使用lodash中的方法):

1)_.union([arrays]):合并数组,并返回去重后的数组  (并集)

    var arr1 = _.union([2,3],[3,8],[2,7]);//返回的是组合在一起并去重的数组,但并非排序后的数组
console.log(arr1);//[2, 3, 8, 7]

2)_.uniq(array, [isSorted], [iteratee], [thisArg]):数组去重

array:需要检查的数组;[isSorted]:可有可无,如为true,则对数组排序,否则不排序;[iteratee] (Function|Object|string): The function invoked per iteration.

    var arr2 = _.uniq([2,3,3,8,2,7],true);
console.log(arr2);//[2, 3, 8, 7]
var arr3 = _.uniq([3,3,2,1, 1, 2], true);
console.log(arr3);//[3, 2, 1]

疑问:为什么我使用的排序属性没有起作用呢?百思不得其解……

3)_.without(array, [values]):返回一个新数组,其中不包括[values]中的元素([values]也就是过滤掉的元素)

    var arr4 = _.without([3,3,2,1, 1, 2],3);
console.log(arr4);//[2, 1, 1, 2]

4)_.xor([arrays]):合并数组,并返回一个新数组,去除掉重复出现的元素  (补集)

    var arr8 = _.xor([1,2,4], [3,2,8,5],[2,8,7]);
console.log(arr8);//[1, 4, 3, 5, 7]

5)_.interseciton([arrays]):     (交集)

   var a = [22,11,99];
var b = [11,77,55,22];
var c = [53,77,33,22];
console.log(_.union(a, b, c));//[22, 11, 99, 77, 55, 53, 33]
console.log(_.intersection(a, b, c));//[22]
console.log(_.xor(a, b,c));//[99, 55, 53, 33]
  • 后言:

关于lodash的更多便利,接下来继续学习!

lodash(一)数组的更多相关文章

  1. lodash获取数组或对象的值 at

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  2. Lodash中数组常用方法

    数组方法 1.数组对象去重 differenceBy(array, [values], [iteratee=_.identity]) let newArr =_.differenceBy( [{ na ...

  3. lodash 工具库

    lodash是一套工具库,内部封装了很多字符串.数组.对象等常见数据类型的处理函数. 1.lodash的引用 import _ from 'lodash' 用一个数组遍历来说明为什么要使用lodash ...

  4. 搭建Mock Server

    1.为什么要搭建mock-server? 为了更好的分工合作,让前端能在不依赖后端环境的情况下进行开发,其中一种手段就是为前端开发者提供一个 web 容器,这个本地环境就是 mock-server. ...

  5. MockWebServer--环境

    MockWebServer是一个可脚本化的用于测试HTTP客户端的Web服务器.主要用于测试你的应用在进行HTTP.HTTPS请求时是否按照预期的行为动作.使用该工具,你可以验证应用的请求是否符合预期 ...

  6. tsconfig.json配置说明

    配置 tsconfig.json tsconfig.json 所包含的属性并不多,只有 7 个,ms 官方也给出了它的定义文件.但看起来并不怎么舒服,这里就翻译整理一下.(若有误,还请指出) file ...

  7. JS-拷贝对象

    As it is well known to us all, 拷贝对象分为浅拷贝和深拷贝,深拷贝只会复制地址,深拷贝才会复制内容,那么 JS 如何进行这两种拷贝呢? # 浅拷贝 ## Object.a ...

  8. 读lodash源码之从slice看稀疏数组与密集数组

    卑鄙是卑鄙者的通行证,高尚是高尚者的墓志铭. --北岛<回答> 看北岛就是从这两句诗开始的,高尚者已死,只剩卑鄙者在世间横行. 本文为读 lodash 源码的第一篇,后续文章会更新到这个仓 ...

  9. lodash源码分析之数组的差集

    外部世界那些破旧与贫困的样子,可以使我内心世界得到平衡. --卡尔维诺<烟云> 本文为读 lodash 源码的第十七篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodas ...

随机推荐

  1. RTX——第7章 任务管理

    以下内容转载自安富莱电子: http://forum.armfly.com/forum.php 单任务系统学习多任务系统之前,我们先来回顾下单任务系统的编程框架,即裸机时的编程框架. 裸机编程主要是采 ...

  2. c++之——template模板函数

    为了实现与数据类型无关的编程,模板应运而生: #include<iostream> #include<string.h> using namespace std; templa ...

  3. CSS3 Transitions属性打造动画的下载按钮特效

    一个网站的下载按钮应尽量吸引读者的注意. 这意味着网页设计师应该非常重视文件的下载界面.一个页面这么多的文件,如图片,视频和插件可以通过直接HTTP下载共享.许多免费网站甚至发布图标集和PSD文件供用 ...

  4. C语言 · 完美的代价

    基础练习 完美的代价   时间限制:1.0s   内存限制:512.0MB        锦囊1 使用贪心算法. 锦囊2 从左到右枚举每个字符,移动对应字符.个数为单的字符放中间.   问题描述 回文 ...

  5. 使用DroneKit控制无人机

    DroneKit-Python是一个用于控制无人机的Python库.DroneKit提供了用于控制无人机的API,其代码独立于飞控,单独运行在机载电脑(Companion Computer)或其他设备 ...

  6. iOS错误整理--自定义按钮,给按钮内部赋值出现的错误

    一.练习中为了实现自定义按钮,按钮中的imageView和titleLabel默认是左右排列的.在练习中自定义为上下排列. *在以下方法中重新布局按钮中的子控件 - (void)layoutSubvi ...

  7. 关闭 禁用 Redis危险命令

    Redis的危险命令主要有: flushdb,清空数据库 flushall,清空所有记录,数据库 config,客户端连接后可配置服务器 keys,客户端连接后可查看所有存在的键 我们常常需要禁用以上 ...

  8. 我们要注意的Mysql基本安全设置

    1.设置或修改Mysql root密码:默认安装后空密码,以mysqladmin命令设置密码: mysqladmin -uroot password "password" Mysq ...

  9. web.xml配置文件元素详解

    一.web.xml配置文件常用元素及其意义 1 <web-app> 2 3 <!--定义了WEB应用的名字--> 4 <display-name></disp ...

  10. Spring 4 官方文档学习(十)数据访问之DAO支持

    1.介绍 Spring 中 Data Access Object (DAO)支持 的目标是以一种一致的方式更简单的使用JDBC.Hibernate.JPA或JDO等数据访问技术.可以在前面说的几种数据 ...