lodash(一)数组
前言:
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(一)数组的更多相关文章
- lodash获取数组或对象的值 at
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- Lodash中数组常用方法
数组方法 1.数组对象去重 differenceBy(array, [values], [iteratee=_.identity]) let newArr =_.differenceBy( [{ na ...
- lodash 工具库
lodash是一套工具库,内部封装了很多字符串.数组.对象等常见数据类型的处理函数. 1.lodash的引用 import _ from 'lodash' 用一个数组遍历来说明为什么要使用lodash ...
- 搭建Mock Server
1.为什么要搭建mock-server? 为了更好的分工合作,让前端能在不依赖后端环境的情况下进行开发,其中一种手段就是为前端开发者提供一个 web 容器,这个本地环境就是 mock-server. ...
- MockWebServer--环境
MockWebServer是一个可脚本化的用于测试HTTP客户端的Web服务器.主要用于测试你的应用在进行HTTP.HTTPS请求时是否按照预期的行为动作.使用该工具,你可以验证应用的请求是否符合预期 ...
- tsconfig.json配置说明
配置 tsconfig.json tsconfig.json 所包含的属性并不多,只有 7 个,ms 官方也给出了它的定义文件.但看起来并不怎么舒服,这里就翻译整理一下.(若有误,还请指出) file ...
- JS-拷贝对象
As it is well known to us all, 拷贝对象分为浅拷贝和深拷贝,深拷贝只会复制地址,深拷贝才会复制内容,那么 JS 如何进行这两种拷贝呢? # 浅拷贝 ## Object.a ...
- 读lodash源码之从slice看稀疏数组与密集数组
卑鄙是卑鄙者的通行证,高尚是高尚者的墓志铭. --北岛<回答> 看北岛就是从这两句诗开始的,高尚者已死,只剩卑鄙者在世间横行. 本文为读 lodash 源码的第一篇,后续文章会更新到这个仓 ...
- lodash源码分析之数组的差集
外部世界那些破旧与贫困的样子,可以使我内心世界得到平衡. --卡尔维诺<烟云> 本文为读 lodash 源码的第十七篇,后续文章会更新到这个仓库中,欢迎 star:pocket-lodas ...
随机推荐
- string.h中的库函数
虽然面试的时候,都会叫你不使用c库函数,自己完成某某函数的编写,但是库函数毕竟更让人信赖,我们没有任何理由怀疑库函数而使用自己的版本.不过当做练习,自己还是可以实现一下的.这里记录一下5th c pr ...
- 一款由css3和jquery实现的卡面折叠式菜单
之前已经为大家介绍了好多导航菜单.今天为大家再带来一款由css3和jquery实现的卡片折叠式菜单.当菜单关闭的时候,有三维堆叠的效果.我们一起看下效果图: 在线预览 源码下载 html代码: & ...
- 【Unity笔记】物体朝着鼠标位置移动
其实思路也很简单,就是先获取到鼠标的坐标,然后赋值给目标物体即可. void Update(){ // 物体跟随鼠标移动 Vector2 mousePos = Input.mousePosition; ...
- JSON对应的maven依赖包
常用有三种json解析jackson.fastjson.gson. jackson依赖包 <!-- https://mvnrepository.com/artifact/com.fasterxm ...
- 如何在Windows系统上面安装redis
一.Redis简介 Redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zset(s ...
- 结合使用 Oracle 和 Ruby on Rails 的补充
本文是对此文的补充: 结合使用 Oracle 和 Ruby on Rails http://www.oracle.com/technetwork/cn/tutorials/rubyrails-0959 ...
- 【转】C#获取电脑客户端IP地址及当前用户名
在C#中获取一台电脑名,IP地址及当前用户名是非常简单,以下是我常用的几种方法: 1. 在ASP.NET中专用属性: 获取服务器电脑名:Page.Server.ManchineName 获取用户信息: ...
- 在Access中执行SQL语句
Access在小型系统开发中等到了广泛使用.虽然Access提供了可视化的操作方法,但许多开发人员还是喜欢直接用SQL语句操作数据表.如何在Access中打开SQL视图,对于初次使用Access的程序 ...
- 扫盲:java中关于路径的问题
../FileName:当前工程的上级目录. ./FileName:当前工程所在的目录. /FileName:当前工程所在磁盘的根目录(windows下). FileName:当前工程所在的目录.
- iOS: [UITableView reloadData]
在 iTouch4 或者相差不多的 iPhone 上,不建议在 UIViewController 的 viewWillAppear 的方法中放置 UITableView 的 reloadData 方法 ...