SoFunction
Updated on 2025-03-10

JavaScript utility library lodash

Lodash is a JavaScript utility library that provides many commonly used functions and tools, which can help us more easily manipulate data and process logic.

debounce / anti-shake

  • Purpose / Usage: Used to limit the frequency of function execution, especially in input or search events.
  • Example / Code Example:
import { debounce } from 'lodash';
const handleSearch = debounce(() => {
  // Add search logic here}, 500);
  • explain /Detailed ExplanationdebounceUsed to delay function execution until a specified inactive time has passed. It is usually used to prevent frequent search requests when user inputs.

filter / filter

  • Purpose / Usage: Used to filter elements in an array based on specific conditions.
  • Example / Code Example:
import { filter } from 'lodash';
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = filter(numbers, num => num % 2 === 0);
  • Explanation / Detailed Explanation: filterUsed to filter elements in an array based on conditions, returning a new array of elements that meet the conditions.

groupBy / grouping

Purpose / Usage: Used to group arrays or objects by specific properties or conditions.
Example / Code Example:

import { groupBy } from 'lodash';
const people = [
  { name: 'Alice', age: 30 },
  { name: 'Bob', age: 28 },
  { name: 'Carol', age: 30 },
];
const groupedByAge = groupBy(people, 'age');
  • Explanation / Detailed Explanation: groupByAn array or object can be grouped into a new object based on the specified attribute or condition, where the key of each group is the value of the attribute value or condition.

reduce / Redeem

  • Purpose / Usage: Used to reduce elements in an array and combine them into a single value.
  • Example / Code Example:
import { reduce } from 'lodash';
const numbers = [1, 2, 3, 4, 5];
const sum = reduce(numbers, (acc, num) => acc + num, 0);
  • Explanation / Detailed Explanation: reduceUsed to apply elements in the array to the specified reduction function in turn, combining them into a single value (sum here).

find / find

  • Purpose / Usage: Used to find the first element in an array that meets a specific condition.
  • Example / Code Example:
import { find } from 'lodash';
const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Carol' },
];
const user = find(users, { name: 'Bob' });
  • Explanation / Detailed Explanation:findUsed to find the first element that meets the criteria in the array and return the found element object.

flatten / flatten

  • Purpose / Usage: Used to flatten multi-layer nested arrays into single-layer arrays.
  • Example / Code Example:
import { flatten } from 'lodash';
const nestedArray = [1, [2, [3, [4]], 5]];
const flatArray = flatten(nestedArray);

difference / difference set

  • Purpose / Usage: Used to calculate the difference between two arrays, that is, return elements that appear in the first array but not in the second array.
  • Example / Code Example:
import { difference } from 'lodash';
const array1 = [1, 2, 3, 4, 5];
const array2 = [3, 4, 5, 6, 7];
const diff = difference(array1, array2);
  • Explanation / Detailed Explanation: differenceUsed to find the difference between two arrays, returning elements that only appear in the first array.

intersection / intersection

  • Purpose / Usage: Used to calculate the intersection of two arrays, that is, return elements that appear in both arrays at the same time.
  • Example / Code Example:
import { intersection } from 'lodash';
const array1 = [1, 2, 3, 4, 5];
const array2 = [3, 4, 5, 6, 7];
const common = intersection(array1, array2);

Explanation / Detailed Explanation: intersectionUsed to find common elements between two arrays and return elements that appear in both arrays at the same time.

zip / compression

Purpose / Usage: Used to compress the corresponding elements of multiple arrays by index position.
Example / Code Example:

import { zip } from 'lodash';
const array1 = [1, 2, 3];
const array2 = ['a', 'b', 'c'];
const zipped = zip(array1, array2);

Explanation / Detailed Explanation: zipUsed to compress the corresponding elements of multiple arrays by index position, returning an array containing tuples.

This is the end of this article about lodash usage. For more related lodash usage, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!