工作中能帮你偷懒的lodash函数！提高开发效率！
Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。在实际的开发中会经常用到，可以很大程度上提高我们的开发效率，在lodash中有哪些高频使用的函数呢？
安装与使用
npm i --save lodash
import _ from "lodash";
1 _.uniq(array)
对数组进行去重，返回一个新的数组。
const arr = [1, 2, 2, 3];
const res = _.uniq(arr);
console.log(res);// [1, 2, 3]
console.log([...new Set(arr)]);//[1, 2, 3]
console.log(Array.from(new Set(arr)));//[1, 2, 3]
2 _.isEqual(value1, value2)
比较两个值是否相等，比较的对象可以是数组、对象、字符串、日期等，不支持函数和DOM节点的比较。
因为支持深层次的比较，适用于对象和数组。
const object1 = { a: 1, b: { c: 2 } };
const object2 = { a: 1, b: { c: 2 } };
console.log(_.isEqual(object1, object2)); // true
const arr = [1, 2, 2, 3];
const arr2 = [1,2]
console.log(_.isEqual(arr, arr2));//false
3. _.isEmpty(value)
检查对象、数组、字符串等是否为空。
console.log(_.isEmpty({"a":"1"}));//false
console.log(_.isEmpty([]));//true
console.log(_.isEmpty("hello"));//false
console.log(_.isEmpty(null));//true
console.log(_.isEmpty(undefined));//true
注意：检查的是可枚举类型，像Number和Boolean无效
console.log(_.isEmpty(0));//true
console.log(_.isEmpty(1));//true
console.log(_.isEmpty(true));//true
console.log(_.isEmpty(false));//true
3 _.groupBy()
根据指定的条件将数组或对象中的元素进行分组。
返回一个由分组的属性为键名组成的对象。
const arr = [
{
name: "jack",
sex: "male",
},
{
name: "lili",
sex: "female",
},
{
name: "jam",
sex: "male",
},
];
console.log(_.groupBy(arr,'sex'));//以年龄去分组
// {
// "male": [
// {
// "name": "jack",
// "sex": "male"
// },
// {
// "name": "jam",
// "sex": "male"
// }
// ],
// "female": [
// {
// "name": "lili",
// "sex": "female"
// }
// ]
// }
4 _.sortBy()
根据指定的条件对数组进行排序，返回一个新的数组。
const students = [
{ name: 'a', grade: 'B', age: 20 },
{ name: 'b', grade: 'A', age: 22 },
{ name: 'c', grade: 'C', age: 21 },
{ name: 'd', grade: 'B', age: 18 }
];
//先按照成绩排序，然后在相同成绩的情况下按照年龄排序
const sortedStudents = _.sortBy(students, ['grade', 'age']);
console.log(sortedStudents);
/*
[
{
"name": "b",
"grade": "A",
"age": 22
},
{
"name": "d",
"grade": "B",
"age": 18
},
{
"name": "a",
"grade": "B",
"age": 20
},
{
"name": "c",
"grade": "C",
"age": 21
}
]
*/
5 _.map()
返回处理数组元素结果；数组中通过属性名查找符合的对象属性值。
const numbers = [1, 2, 3];
console.log( _.map(numbers, n => n * n));// [1, 4, 9]
const arr = [
{ 'user': 'a',age:20 },
{ 'user': 'b',age:18 }
]
console.log(_.map(arr,'user'));// ['a', 'b']
6 _.find()
在数组或对象中查找符合指定条件的第一个元素
const users = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' },
{ id: 4, name: 'David' }
];
const user = _.find(users, { id: 2 });//查找 id 为 2 的用户
console.log(user);// { id: 2, name: 'Bob' }
也可以在第二个参数中传入自定义函数，对复杂情况进行判断。
const userWithA = _.find(users, user => user.name.startsWith('A'));//查找第一个名字以 'A' 开头的
console.log(userWithA); // { id: 1, name: 'Alice' }
注意：要与filter区分开，filter是返回的是符合条件的数组，而find返回的是一个对象。
7 _.cloneDeep(value)
对数组或对象进行深拷贝。因为数组和对象都是引用数据类型，所以直接操作一个值的时候会影响另一个值的变化。
深拷贝后会生成一个新的对象，修改复制后的对象不会影响原始对象。
const originalObject = {
a: 1,
b: {
c: 2,
d: [3, 4]
}
};
const clonedObject = _.cloneDeep(originalObject);
// { a: 1, b: { c: 2, d: [3, 4] } }
8 _.isNil(value)
判断值是否是 null或者 undefined。一般会用于请求接口后进行边界判断。
_.isNil(null);
// => true
_.isNil(void 0);
// => true
_.isNil(NaN);
// => false
9 _.debounce(func, [wait=0], [options=])
用于创建一个防抖函数。防抖函数可以延迟调用一个函数，并在最后一次调用之后的特定时间段内未再次调用时才执行该函数。
function saveChanges() {
console.log('Changes saved.');
}
const debouncedSave = _.debounce(saveChanges, 1000);
// 在某些连续操作中调用 saveChanges，但只有在最后一次调用后经过 1000 毫秒未再次调用时才执行函数
debouncedSave();
debouncedSave();
debouncedSave();
// 等待 1000 毫秒后执行 saveChanges 函数
// 输出：Changes saved.
防抖函数常用于优化用户输入，例如搜索框输入时的实时搜索，可以确保只在用户停止输入一段时间后才触发实际的搜索请求，从而减少不必要的网络请求或计算开销。
10 _.reduce()
将一个集合（可以是数组或对象）的元素合并为一个单一的值。每一次都是循环并更新值。
// 计算数组元素的总和
const numbers = [1, 2, 3, 4, 5];
//accumulator：累加值 value当前值
const sum = _.reduce(numbers, (accumulator, value) => accumulator + value, 0);// 初始值 0
console.log(sum); // 输出：15
// scores 中找到得分最高的学科
const scores = { math: 90, english: 85, science: 88 };
const maxScoreSubject = _.reduce(scores, (maxSubject, score, subject) => {
return score > scores[maxSubject] ? subject : maxSubject;
}, Object.keys(scores)[0]);
console.log(maxScoreSubject); // 输出：'math'