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 de caractères et des objets et découvrez ses fonctionnalités avancées comme la composition de fonctions.
Démarrer 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 avec npm ou yarn.
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 HTML.
Pour utiliser lodash dans un projet Node.js, vous devez l’installer dans votre répertoire de projet. Pour ce faire, vous pouvez utiliser npm ou yarn :
npm install --save lodash
# or
yarn add lodash
Vous pouvez maintenant utiliser lodash en le demandant 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, entrez la commande node :
node [Your script name]
Manipulation de tableaux dans Lodash
Lodash est livré avec un ensemble de méthodes pour la manipulation des tableaux qui offrent des fonctionnalités au-delà de la classe Array intégrée de JavaScript.
.chunk
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 demandée.
Voici un exemple :
const array = [ 'a', 'b', 'c', 'd', 'e', 'f', 'g' ];
const newArray = _.chunk(array, 2)
console.log(newArray)
// Output:
// [ [ 'a"https://www.makeuseof.com/lodash-javascript-introduction-benefits/,"b' ], [ 'c"https://www.makeuseof.com/lodash-javascript-introduction-benefits/,"d' ], [ 'e"https://www.makeuseof.com/lodash-javascript-introduction-benefits/,"f' ], [ 'g' ] ]
.concat
Cette méthode génère un nouveau tableau en concaténant des valeurs à la fin d’un tableau existant.
Par exemple :
const array = [ 1, 2, 'a' ];
const newArray = _.concat(array, 5, 'b', [ 8 ], [ [ 9 ] ]);
console.log(newArray);
// Output:
// [ 1, 2, 'a', 5, 'b', 8, [ 9 ] ]
.join
Cette méthode renvoie une chaîne de caractères en combinant les éléments d’un tableau. Elle les joint en utilisant un délimiteur que vous passez en paramètre lors de l’appel de la méthode. Le délimiteur par défaut utilisé est la virgule :
const array = [ "l", "o", "d", "a", "s", "h" ];
const newArray = _.join(array);
console.log(newArray);
// Output:
// l,o,d,a,s,h
const newArray = _.join(array, "-");
console.log(newArray);
// Output:
// l-o-d-a-s-h
Manipulation de chaînes de caractères dans Lodash
Avec un simple JavaScript, le formatage des chaînes de caractères est un processus simple. Mais lodash le rend encore plus facile.
Parmi les opérations les plus courantes de manipulation de chaînes de caractères que vous pouvez effectuer avec lodash, citons :
.startsWith et .endsWith
Ces deux méthodes vérifient si une chaîne de caractères commence ou se termine par une sous-chaîne, respectivement. Les deux méthodes renvoient une valeur booléenne de type true ou false.
Par exemple :
const string = "lodash";
console.log(_.startsWith(string, "l"));
// Output: true
console.log(_.startsWith(string, "o"));
// Output: false
console.log(_.endsWith(string, "m"));
// Output: false
console.log(_.endsWith(string, "h"));
// Output: true
.repeat
Cette méthode permet d’imprimer une chaîne de caractères un nombre spécifique de fois. Elle prend la chaîne de caractères 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
.trim
Cette méthode supprime les espaces blancs de début et de fin de chaîne. Vous pouvez également l’utiliser pour supprimer tout caractère spécifique au début et à la fin d’une chaîne.
Par exemple :
// 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, "https://www.makeuseof.com/lodash-javascript-introduction-benefits/,")
console.log(newString);
// Output: bar
Manipulation d’objets dans Lodash
Voici quelques exemples de manipulation de chaînes de caractères que vous pouvez effectuer avec lodash :
.merge
Le site _.merge() crée un nouvel objet en combinant les propriétés des objets d’entrée. La valeur d’une propriété du dernier objet remplacera la valeur de l’objet précédent si la propriété est présente dans plus d’un objet.
Par exemple :
const books = {
'Mathematics': 4,
'Science': 7
};
const notes = {
'Science': 3 ,
'Chemistry': 5
};
_.merge(books, notes);
console.log(books);
// Output:
// { Mathematics: 4, Science: 3, Chemistry: 5 }
Dans cet exemple, la méthode ajoute la propriété « Chemistry » du deuxième objet et écrase la valeur de la propriété « Science » du premier objet.
.a
Cette méthode retourne true si une série donnée de propriétés existe dans un objet et false sinon.
Par exemple :
const books = {
'Mathematics': 4,
'Science': 7
};
console.log(_.has(books, "Mathematics"));
// Output: true
.omettre
Cette méthode retourne un nouvel objet en supprimant les propriétés spécifiées de l’objet donné.
Par exemple :
var books = {
'Mathematics': 4,
'Science': 3 ,
'Chemistry': 5
};
console.log(_.omit(books, "Science"));
// Output: { Mathematics: 4, Chemistry: 5 }
Composition des fonctions dans Lodash
La composition de fonctions est une technique que vous pouvez utiliser dans un langage de programmation fonctionnel. Elle consiste à combiner deux ou plusieurs fonctions en 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 la fonction flux et _.flowRight fonctions. Le site _.flow() accepte une liste de fonctions en tant qu’arguments et produit une nouvelle fonction qui applique les fonctions dans le même ordre que celui dans lequel vous les avez passées. Le site _.flowRight() fait la même chose, mais elle appelle les fonctions en sens inverse.
Par exemple :
function addFive(number) {
return number + 5
}
function timesTwo(number) {
return number * 2
}
const addFiveAndTimesTwo = _.flow([addFive, timesTwo]);
const addFiveAndTimesTwoReverse = _.flowRight([addFive, timesTwo]);
console.log(addFiveAndTimesTwo(3));
// Output: 16
console.log(addFiveAndTimesTwoReverse(3));
// Output: 11
Le code ci-dessus définit les fonctions addFive et foisDeux. La fonction addFive renvoie le résultat de l’addition de 5 à un nombre donné. La fonction timesTwo multiplie un nombre donné 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.
Le site _.flowRight() produit une nouvelle fonction qui fait la même chose que flow, mais en sens inverse.
Enfin, ce code appelle les deux nouvelles fonctions, en passant 3comme 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 plus faciles à maintenir. 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.