-
前言:
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的更多便利,接下来继续学习!