前言
📫 大家好,我是南木元元,热爱技术和分享,欢迎大家交流,一起学习进步!
🍅 个人主页:南木元元
目录
什么是lodash
Lodash是一个流行的JavaScript实用工具库,提供了许多高效、高兼容性的工具函数,能够方便地处理集合、字符串、数值、函数等多种数据类型,大大提高工作效率。
lodash的按需引入
有些人说lodash里面的好多方法都能自己实现,没必要再引入额外的工具库来增加项目的体积,但是你能保证你实现得比lodash好吗?而且lodash支持多种模块化方案,配合tree-shaking技术或者使用单独的函数模块,几乎不会导致冗余代码。
// 方式1:引入整个lodash对象
import _ from "lodash";
// 方式2:按名称引入特定的函数
import { cloneDeep } from "lodash";
// 上述2种方式都会引入整个lodash库,体积大,而下面2种方式都能实现按需引入,减小体积
// 1.只引入cloneDeep函数
import cloneDeep from "lodash/cloneDeep";
// 2.使用lodash-es
import { cloneDeep } from "lodash-es";
上述第一种方式只会引入引用路径对应的模块,第二种方式使用了es6模块语法的lodash-es(lodash默认是commonjs版本),这让 webpack等打包工具可以对其进行tree-shaking,去除无用的代码,减小打包体积。
接下来总结一些常用的lodash工具方法。
数组操作
求交集
intersection:返回一个包含所有传入数组交集元素的新数组。
_.intersection([2, 1], [4, 2], [1, 2]);
// => [2]
intersectionBy:根据某个字段来进行计算交集。
_.intersectionBy([{ 'x': 1 }], [{ 'x': 2 }, { 'x': 1 }], 'x');
// => [{ 'x': 1 }]
intersectionWith:根据某个条件函数来计算交集,比如使用isEqual。
var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];
_.intersectionWith(objects, others, _.isEqual);
// => [{ 'x': 1, 'y': 2 }]
求合集
union:返回一个新的联合数组。
_.u