Une introduction à Lodash et ses avantages pour les développeurs JavaScript

Lodash est une bibliothèque JavaScript qui offre des fonctions utilitaires pour les tâches de programmation typiques utilisant le modèle de programmation fonctionnelle.

La bibliothèque, qui fonctionne avec les navigateurs Web et Node.js, peut modifier et convertir des données, effectuer des opérations asynchrones, etc.

Apprenez à utiliser lodash pour manipuler des tableaux, des chaînes et des objets et découvrez ses fonctionnalités avancées telles que la composition de fonctions.

Premiers pas avec Lodash

Vous pouvez ajouter lodash à votre application de deux manières : en utilisant un réseau de diffusion de contenu (CDN) ou en l’installant à l’aide de npm ou de fil.

Pour utiliser lodash directement dans le navigateur, copiez le lien CDN lodash ci-dessous et insérez-le dans la section head de votre fichier HTML :

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js"
  type="text/javascript"></script>


En utilisant cette approche, vous pouvez exécuter des scripts en utilisant lodash dans le corps de votre code HTML.

Pour utiliser lodash dans un projet Node.js, vous devez l’installer dans le répertoire de votre projet. Vous pouvez utiliser npm ou yarn pour le faire :

npm install --save lodash
# or
yarn add lodash


Vous pouvez désormais utiliser lodash en l’exigeant dans votre fichier JavaScript :

// Requiring the lodash library
const _ = require("lodash");


// Using the _.sum method
const numbers = [10, 20, 30, 40, 50];
const sum = _.sum(numbers);
console.log(sum);


Pour exécuter votre fichier JavaScript, saisissez la commande node :

node [Your script name]


Manipulation de tableaux dans Lodash

Lodash est livré avec un ensemble de méthodes de manipulation de tableaux qui fournissent des fonctionnalités au-delà de la classe Array intégrée de JavaScript.

.tronçon

Cette méthode divise un tableau en groupes de tableaux plus petits d’une taille donnée. Le morceau final peut être plus petit que la taille que vous demandez.

Voici un exemple :

const array = [ 'a', 'b', 'c', 'd', 'e', 'f', 'g' ];
const newArray = _.chunk(array, 2)
console.log(newArray)


// Output:
// [ [ 'a', 'b' ], [ 'c', 'd' ], [ 'e', 'f' ], [ 'g' ] ]


.concat

Cette méthode génère un nouveau tableau en concaténant des valeurs à la fin d’un tableau existant.

Par example:

const array = [ 1, 2, 'a' ];
const newArray = _.concat(array, 5, 'b', [ 8 ], [ [ 9 ] ]);
console.log(newArray);


// Output:
// [ 1, 2, 'a', 5, 'b', 8, [ 9 ] ]


.rejoindre

Cette méthode renvoie une chaîne en combinant les éléments d’un tableau. Il les joint à l’aide d’un délimiteur que vous passez en paramètre lors de l’appel de la méthode. Le délimiteur par défaut qu’il utilise est une virgule :

const array = [ "l", "o", "d", "a", "s", "h" ];
const newArray = _.join(array);
console.log(newArray);


// Output:
// l,o,d,a,s,h

// Output:
// l-o-d-a-s-h


Manipulation de chaînes dans Lodash

Avec JavaScript nu, le formatage des chaînes est un processus simple. Mais lodash le rend encore plus facile.

Certaines des opérations de manipulation de chaînes les plus courantes que vous pouvez effectuer avec lodash incluent :

.startsWith et. se termine par

Ces deux méthodes vérifient si une chaîne commence ou se termine par une sous-chaîne, respectivement. Les deux méthodes renvoient une valeur booléenne true ou false.

Par example:

const string = "lodash";


console.log(_.startsWith(string, "l"));
// Output: true

console.log(_.endsWith(string, "h"));
// Output: true


.répéter

Cette méthode imprime à plusieurs reprises une chaîne un nombre de fois spécifique. Il prend la chaîne comme premier argument et le nombre de répétitions comme second :

const string = "lodash"
const newString = _.repeat(string, 3);
console.log(newString);
// Output: lodashlodashlodash


.garniture

Cette méthode supprime les espaces de début et de fin. Vous pouvez également l’utiliser pour supprimer des caractères spécifiques au début et à la fin d’une chaîne.

Par example:

// Removing leading & trailing whitespace
const string = "bar "
const newString = _.trim(string)
console.log(newString);
// Output: bar


// Removing specified characters
const string = ",bar,"
const newString = _.trim(string, ",")
console.log(newString);
// Output: bar


Manipulation d’objets dans Lodash

Vous trouverez ci-dessous quelques exemples de manipulation de chaînes que vous pouvez effectuer avec lodash :

.fusionner

La méthode _.merge() crée un nouvel objet en combinant les propriétés des objets d’entrée. La valeur d’une propriété de l’objet le plus récent remplacera la valeur de l’objet précédent si la propriété est présente dans plusieurs objets.

Par example:

const books = {
    'Mathematics': 4,
    'Science': 7
};


const notes = {
    'Science': 3,
    'Chemistry': 5
};

Dans cet exemple, la méthode ajoute la propriété ‘Chimie’ du deuxième objet et écrase la valeur de la propriété ‘Science’ du premier objet.

.a

Cette méthode renvoie true si une série donnée de propriétés existe dans un objet et false sinon.

Par example:

const books = {
    'Mathematics': 4,
    'Science': 7
};


console.log(_.has(books, "Mathematics"));
// Output: true


.omettre

Cette méthode renvoie un nouvel objet en supprimant les propriétés spécifiées de celui donné.

Par example:

var books = {
    'Mathematics': 4,
    'Science': 3,
    'Chemistry': 5
};


console.log(_.omit(books, "Science"));
// Output: { Mathematics: 4, Chemistry: 5 }


Composition des fonctions en Lodash

La composition de fonctions est une technique que vous pouvez utiliser dans un langage de programmation fonctionnel. Cela implique de combiner deux fonctions ou plus dans une nouvelle fonction en appelant chaque fonction dans un ordre particulier. Cette fonction vous permet de créer une logique plus complexe à partir de fonctions plus simples.

Pour appliquer cette technique, lodash est livré avec les fonctions _.flow et _.flowRight . La fonction _.flow() accepte une liste de fonctions comme arguments et génère une nouvelle fonction qui applique les fonctions dans le même ordre que vous les transmettez. La fonction _.flowRight() fait la même chose, mais elle appelle les fonctions dans inverser.

Par example:

function addFive(number) {
    return number + 5
}


function timesTwo(number) {
    return number * 2
}

console.log(addFiveAndTimesTwoReverse(3));
// Output: 11


Le code ci-dessus définit les fonctions addFive et timesTwo . La fonction addFive renvoie le résultat de l’ajout de 5 à un nombre donné. La fonction timesTwo multiplie un nombre d’entrée par 2 et renvoie le résultat.

Le code utilise ensuite la fonction _.flow() pour combiner les deux autres et produire la nouvelle fonction, addFiveAndTimesTwo . Cette nouvelle fonction effectuera d’abord l’opération addFive sur son argument avant d’effectuer l’opération timesTwo sur le résultat final.

La fonction _.flowRight() produit une nouvelle fonction qui fait la même chose que le flux, mais en sens inverse.

Enfin, ce code appelle les deux nouvelles fonctions, en passant 3 , comme argument, et enregistre les résultats dans la console.

Les avantages de travailler avec Lodash

Vous pouvez utiliser lodash pour simplifier votre code et rendre vos projets plus flexibles et maintenables. Sa large gamme de fonctions utilitaires, son adoption généralisée et ses mises à jour régulières vous aideront à écrire un code élégant et efficace. Vous pouvez utiliser lodash pour garantir que votre code est toujours à jour et compatible avec les navigateurs contemporains.