LODASH

Google et StackOverflow sont tes meilleurs amis ? Alors cet article est pour toi, car je vais te présenter ton 3ème ami : « Lodash ».

Présentation

Lodash est une librairie open source JavaScript qui propose des outils permettant de simplifier la manipulation des tableaux, nombres, strings, et objets.
Lodash est régulièrement mis-à-jour, et est actuellement à la version 4.17.21.

Le projet Lodash est accessible sur GitHub .

Installation

Pour installer Lodash avec npm, c’est très simple, il suffit de taper la commande suivante :

npm i --save lodash

Après avoir installé lodash, il suffit d'importer les méthodes dont vous avez besoin.

Pour importer une méthode lodash dans votre projet, il suffit de l’importer de cette manière:

Import { isEqual } from ‘lodash’;  

Vous pouvez aussi, si besoin, importer toutes les méthodes lodash à la fois à l’aide d’un alias:

Import * as _ from ‘lodash’. 

Dans ce cas, il vous faudra utiliser le “_.” en préfixe avant d’appeler vos méthodes.

Exemple avec la méthode isEqual():

  _.isEqual()

Installer Lodash sans NPM

Si vous n’utilisez pas npm, alors il suffit de télécharger la librairie à partir du site officiel et l’importer dans votre page HTML à l’aide de la balise HTML: <script>.

<script src="lodash.js"></script>

Sources

Les sources sont disponible sur le site officiel de Lodash.

Voici quelques fonctions intéressantes qui valent le détour :
OrderBy(), DifferenceBy(), Chain().

Voyons de plus près les fonctions citées.

1 -- OrderBy()

Fonctionnalité intéressante de lodash, la méthode orderBy() permet de trier un tableau sur une ou plusieurs propriétés à la fois.

A ce jour, aucune fonction native ne permet de faire du tri sur plusieurs propriétés en JS, le seul moyen d’y parvenir est de créer sa propre fonction et de trier manuellement sur chacune des propriétés.

Cette fonction peut donc vous faire gagner du temps :

Fonction : OrderBy(a,b,c);

Retourne : Un nouveau tableau trié.

Exemple :

let users = [
    { 'user': 'bob', 'age': 48 },
    { 'user': 'patrick', 'age': 34 },
    { 'user': 'bob', 'age': 40 },
    { 'user': 'patrick', 'age': 36 }
];

// Tri des 'user' en ascendant, et par 'age' en descendant

_.orderBy(users, ['user', 'age'], ['asc', 'desc']);

// retourne => [['patrick', 36], ['patrick', 34], ['bob', 48], ['bob', 40]]

2 -- differenceBy()

La fonction differenceBy() est un outil qui simplifie la comparaison entre 2 tableaux.

Fonction : DifferenceBy(a,b,c);

Retourne : Un nouveau tableau incluant les différences.

Exemple :

 _.differenceBy([{ 'x': 2}, {'x': 1 }], [{ 'x': 1 }], 'x');
 // retourne => [{ 'x': 2 }]

## 3 -- Chain()

Un peu à la manière des jouets LEGO, les méthodes lodash sont compatibles entre elles et peuvent s’imbriquer les unes dans les autres à l’aide de la méthode chain().

Exemple :

let users = [
    { 'user': 'jean', 'age': 36 },
    { 'user': 'fred'; 'age': 40 },
    { 'user': 'tom', 'age': 1 }
];

let youngest = _
    .chain(users)
    .sortBy('age')
    .map(function(o) {
        return o.user + ' is ' + o.age;
    })
    .head()
    .value();
    // retourne => 'tom is 1'

Conclusion

Nous avons vu que lodash nous fournit des outils très utiles qui pourraient nous manquer en JS natif.

Lodash contient plus d’une centaine de fonctions, certaines peuvent vous servirent et vous simplifier la vie. C’est pourquoi je vous invite à aller voir la documentation Lodash qui est complète et qualitative.