15 useful Lodash methods for everyday coding
Tags: javascript, beginners, lodash, opensource
Published: 2022-03-02 19:30:35

---
title: 15 useful Lodash methods for everyday coding
published: true
description: In this short post, we'll go over 15 everyday methods that, when used properly, can speed up development and make your code more readable.
tags:
  - javascript
  - beginners
  - lodash
  - opensource
cover_image: https://diogocapela.com/assets/15-useful-lodash-methods-for-everyday-coding-thumbnail-2.jpg
canonical_url: https://diogocapela.com/blog/15-useful-lodash-methods-for-everyday-coding
---

[Lodash](https://lodash.com) is one of the most popular open-source JavaScript libraries. It implements a lot of functional programming helpers that make everyday coding easier. It's something I use often in my own development work, and so I wanted to share with you some of the methods that I find myself using a lot.

In this short post, we'll go over 15 everyday methods that, when used properly, can speed up development and make your code more readable.

## shuffle
> Creates an array of shuffled values (using a version of the [Fisher-Yates shuffle](https://en.wikipedia.org/wiki/Fisher%E2%80%93Yates_shuffle)).
```javascript
import shuffle from 'lodash/shuffle';

const result = shuffle([1, 2, 3, 4, 5]);

// result => [2, 5, 1, 4, 3]
```

## orderBy
> Creates an array of elements, sorted in the specified order by the results of running each element in a collection thru each iteratee.
```javascript
import orderBy from 'lodash/orderBy';

const items = [
  { name: 'Item A', price: 2 },
  { name: 'Item B', price: 8 },
  { name: 'Item C', price: 4 },
  { name: 'Item D', price: 4 }
];

const result = orderBy(items, ['price', 'name'], ['desc', 'asc']);

/*
result => [
  { name: 'Item B', price: 8 },
  { name: 'Item C', price: 4 },
  { name: 'Item D', price: 4 },
  { name: 'Item A', price: 2 }
]
*/
```

## chunk
> Creates an array of elements split into groups of a specified size (if the array can't be split evenly, the final chunk will only contain the remaining elements).
```javascript
import chunk from 'lodash/chunk';

const array = [ 1, 2, 3, 4 ];

const result = chunk(array, 2);

// result => [[1, 2], [3, 4]]
```

## take
> Creates a slice of the array with `n` elements taken from the beginning.
```javascript
import take from 'lodash/take';

const result = take([1, 2, 3], 2);

// result => [1, 2]
```


## difference
> Creates an array of the values not included in the other given arrays. The order and references of result values are determined by the first array.
```javascript
import difference from 'lodash/difference';

const result = difference([1, 2, 3], [2, 3, 4]);

// result => [1]
```

## intersection
> Creates an array of unique values that are included in all given arrays. The order and references of result values are determined by the first array.
```javascript
import intersection from 'lodash/intersection';

const result = intersection([1, 2, 3], [2, 3, 4]);

// result => [2, 3]
```

## isEmpty
> Checks if the value is an empty object, collection, map, or set (objects are considered empty if they have no own enumerable string keyed properties).
```javascript
import isEmpty from 'lodash/isEmpty';

isEmpty({});
// => true

isEmpty({ name: 'John Doe' });
// => false
```

## throttle
> Creates a throttled function that only invokes the passed function at most once per every interval, specified in milliseconds.
```javascript
import throttle from 'lodash/throttle';

const throttled = throttle(() => {
  console.log('Throttled after 50ms!');
}, 50);

window.addEventListener('resize', throttled);
```

## debounce
> Creates a debounced function that delays invoking the passed function until after the specified wait time has elapsed since the last time the debounced function was invoked.
```javascript
import debounce from 'lodash/debounce';

const debounced = debounce(() => {
  console.log('Debounced after 400ms!');
}, 400);

window.addEventListener('resize', debounced);
```

## merge
> Recursively merges own and inherited enumerable string keyed properties of source objects into the destination object.
```javascript
import merge from 'lodash/merge';

const firstObject = { 'A': [{ 'B': 1 }, { 'C': 2 }] };

const secondObject = { 'A': [{ 'B': 3 }, { 'D': 4 }] };

const result = merge(firstObject, secondObject);

// result => { A: [{ B: 3 }, { C: 2, D: 4 }] }
```

## cloneDeep
> Creates a deep clone of a specified value.
```javascript
import cloneDeep from 'lodash/cloneDeep';

const items = [
  { name: 'Item A' },
  { name: 'Item B' },
];

const result = cloneDeep(items);

// result[0] === items[0] => false
```


## startCase
> Converts a string to [start case](https://en.wikipedia.org/wiki/Letter_case#Start_case) (the first letter of each word capitalized).
```javascript
import startCase from 'lodash/startCase';

startCase('--foo-bar--');
// => 'Foo Bar'

startCase('fooBar');
// => 'Foo Bar'

startCase('__FOO_BAR__');
// => 'FOO BAR'
```

## kebabCase
> Converts a string to [kebab case](https://en.wikipedia.org/wiki/Letter_case#Kebab_case) (punctuation is removed, the text is converted to lowercase, and spaces are replaced by single dashes).
```javascript
import kebabCase from 'lodash/kebabCase';

kebabCase('Foo Bar');
// => 'foo-bar'

kebabCase('fooBar');
// => 'foo-bar'

kebabCase('__FOO_BAR__');
// => 'foo-bar'
```

## snakeCase
> Converts a string to [snake case](https://en.wikipedia.org/wiki/Letter_case#Snake_case) (punctuation is removed, the text is converted to lowercase, and spaces are replaced by single underscores).
```javascript
import snakeCase from 'lodash/snakeCase';

snakeCase('Foo Bar');
// => 'foo_bar'

snakeCase('fooBar');
// => 'foo_bar'

snakeCase('--FOO-BAR--');
// => 'foo_bar'
```

## camelCase
> Converts a string to [camel case](https://en.wikipedia.org/wiki/Letter_case#Camel_case) (spaces and punctuation are removed and the first letter of each word is capitalized).
```javascript
import camelCase from 'lodash/camelCase';

camelCase('Foo Bar');
// => 'fooBar'

camelCase('--foo-bar--');
// => 'fooBar'

camelCase('__FOO_BAR__');
// => 'fooBar'
```

That’s all. Thanks! I hope this can help you the next time you write a JavaScript application. [Lodash](https://lodash.com) is a very popular open-source library that's worth checking out if you're looking for ways to build web applications faster.

*Hey! 👋 My name is Diogo and I'm an enthusiastic frontend developer who is passionate about building for the web. If you want to keep in touch check out [my website](https://diogocapela.com) or follow me on [Twitter](https://twitter.com/diogocapela).*