JavaScript

Top 10 Lodash Functions Everyone Should Know About

Lodash is one of the popular JavaScript libraries that offers more than 200 functions for web development. These functions can help you build innovative yet highly interactive web applications. We can use lodash inside a web browser or in NodeJS. In this article, We are going to discuss Lodash and its top 13 features that you should use.

What is Lodash

Lodash makes JavaScript development more peaceful by taking out the trouble of working with arrays, numbers, objects, strings, etc. It’s an open-source JavaScript library with a wide variety of functions that make JavaScript development effortless and quicker. It has functions like map, filter, invokes function binding, JavaScript templating, deep equality checks, creating indexes, and many others that we will discuss here. Lodash can be used directly via the browser or from NodeJS. Development with JavaScript is pretty challenging, but with Lodash, any scale of development can be easier and quicker. 

Top 10 Lodash Functions that Everyone Should Know About

  • _.assign

_.assign is a similar function to the spread operator of ES 6. Easily understandable and can assign properties of one or many objects to a source object.

var first= { a: "value a" };
var second= { b: 4, c: "value c" }

var result = _.assign({ a: "old property" },first,second);
// result => { a: 'a property', b: 4, c: 'an other property' }
  • _.times

_.times can be very helpful when creating dynamic data. It receives as rows of numbers of iterations and a function to perform n times and reflects with an array of the results. 

function getRandomInteger() {
    return Math.round(Math.random() * 100);
}

var result = _.times(5, getRandomNumber);
// result => [64, 70, 29, 10, 23]
  • _.get and _.set

We are counting these two as one because these works are about the same. _.get will return a property state from an object, and _.set will set a property with a value—Same except you can get to a property with the address.

var bar = { foo: { key: "foo" } };
_.set(bar, "foo.items[0]", "An item");
// bar => { foo: { key: "foo", items: ["An item"] } }
var name = _.get(bar, "name", "John Doe");
// name => John Doe
  • _.deburr

_.deburr is the easiest one; It excludes all “combining diacritical marks,” so “é” converts “e.” It’s an immeasurable habit to deburr text for a search function when there is internationalization and localization.

_.deburr("déjà vu");
// -> deja vu
_.deburr("Juan José");
// -> Juan Jose
  • _.keyBy

_.keyBy helps to find and call an object with a specific property. See the example below

var posts = [
    { id: "1abc", title: "First blog post", content: "..." },
    { id: "2abc", title: "Second blog post", content: "..." },
    // more blog posts
    { id: "34abc", title: "The blog post we want", content: "..." }
    // even more blog posts
];

posts = _.keyBy(posts, "id");

var post = posts["34abc"]
// post -> { id: "34abc", title: "The blog post we want", content: "..." }
  • _.reduce

_.reduce is like a filter function, but it allows you to choose the form of the returned object, which makes it different. You can add objects or remove them via the filter method.

var users = [
    { name: "John", age: 30 },
    { name: "Jane", age: 28 },
    { name: "Bill", age: 65 },
    { name: "Emily", age: 17 },
    { name: "Jack", age: 30 }
]

var reducedUsers = _.reduce(users, function (result, user) {
    if(user.age >= 18 && user.age <= 59) {
        (result[user.age] || (result[user.age] = [])).push(user);
    }
  
    return result;
}, {});

// reducedUsers -> { 
//     28: [{ name: "Jane", age: 28 }], 
//     30: [{ name: "John", age: 30 }, { name: "Jack", age: 30 }] 
// }
  • _.debounce

_.debounce will invoke a function in a time cap of a specified amount of time since the last time it was called.

  • _.find

You can use _ .find instead of interacting within an array with a loop to locate a particular object. It can also help you find any object with more than one property with a single line of code.

  • _.cloneDeep

_ .cloneDeep is the easiest one and can clone an object. The cloned object will also have the same properties and new address in memory so that you won’t crush others.

var original = { foo: "bar" };
var copy = original;
copy.foo = "new value";
// copy -> { foo: "new value" } Yeah!
// original -> { foo: "new value" } Oops!

var original = { foo: "bar" };
var copy = _.cloneDeep(original);
copy.foo = "new value";
// copy -> { foo: "new value" } Yeah!
// original -> { foo: "bar" } Yeah!
  • _. sortedUniq

_. sortedUniq stops duplicate values to repeat. Its mainly used for performance issues because it is built to specify the sorted arrays. _. sortedUniq is valid only if you work with an extensive array. If you want better performance, you should sort your array and use functions that work better with sorted arrays. 

var sortedArray = [1, 1, 2, 3, 3, 3, 5, 8, 8];
var result = _.sortedUniq(sortedArray);
// -> [1, 2, 3, 5, 8]

Features of Lodash

Lodash has many integrations and features that help in the development process and makes it easier for developers. Lodash offers 13 types of features in its latest build –

  • Array
  • Collection
  • Date
  • Function
  • Lang
  • Math
  • Number
  • Object
  • Saq
  • Util
  • Properties
  • Methods

Lodash is one of the top libraries for web development that is sufficient to build innovative applications in very little time. It has 13 types of functions mentioned below; In addition, we have mentioned some of the most useful functions that everyone should know.

Aniruddh Agarwal

Founder and CEO of Extern Labs Inc. and A Proven Multi-Skill Developer. I help Startups and Businesses in building their dream projects with advanced tech. tools.

Published by
Aniruddh Agarwal

Recent Posts

WordPress vs Strapi: Choosing the Right CMS for Your Next Project

In the ever-evolving landscape of website development, selecting the right Content Management System (CMS) is… Read More

February 27, 2024

Exploring the Pros and Cons of AR & VR in EduTech

Education is a realm constantly evolving with technological advancements. Augmented Reality (AR) and Virtual Reality… Read More

December 12, 2023

How Digital Menu can Add Good Value to Your Restaurant Business

In today's dynamic culinary landscape, restaurants are not just about serving delectable dishes; they're about… Read More

December 6, 2023

Top 5 Innovations Revolutionizing in Real Estate Industry

The real estate industry has a rich history deeply embedded in the fabric of human… Read More

December 4, 2023

The Changing Face of eCommerce: Evolution, Trends, and the Role of AR/VR Technology

The landscape of eCommerce has experienced a remarkable evolution over the past few decades, transforming… Read More

December 1, 2023

Top 5 Programming Languages & Frameworks for Mobile App Development

Mobile app development has become an integral part of our lives, with nearly every aspect… Read More

September 27, 2023