Archives du mot-clé underscore

Underscore/Lo-Dash : Utilisation de _.chain

J’ai présenté dans un article précédent la bibliothèque utilitaire underscore (et son fork lo-Dash). Je vais ici présenter la méthode chain qui permet de facilement chaîner vos appels pour simplifier l’écriture de votre code.

Imaginons que nous avons une liste de documents et que nous souhaitons récupérer le nom des 10 documents les plus récents (en utilisant la propriété lastUpdate).

On pourrait écrire :

//on tri par la propriété lastUpdate
var orderedDocuments = _.sortBy(documents, 'lastupdate');
//on inverse 
var descOrderedDocuments = _.reverse(orderedDocuments);
//on prend les 10 premiers
var last10Documents = _.first(descOrderedDocuments, 10);
//on récupère leur nom 
var last10DocumentNames = _.pluck(last10Documents, 'name');

On peut voir ici que l’on doit créer des variables temporaires afin de passer le résultat d’une méthode à la méthode suivante, ce qui a pour conséquence de polluer le namespace avec des variables qui ne sont utilisées qu’une fois et d’utiliser de la mémoire inutilement. De plus, si vous devez modifier l’ordre d’appels, vous devrez vous assurer de passer la bonne variable temporaire au bon moment.

Voyons comment utiliser _.chain afin de simplifier et de rendre plus lisible ce code. Il faut d’abord appeler chain. Chain va retourner un wrapper (au lieu du résultat) ce qui va nous permettre d’appeler d’autres méthodes qui vont modifier le résultat. Le résultat de la méthode précédente est passé automatiquement à la fonction suivante. Une fois toutes les opérations terminées, il suffit d’appeler value() pour obtenir le résultat.

var lastDocuments = _.chain(documents)
    .sortBy('lastupdate')
    .reverse()
    .first(10)
    .pluck('name')
    .value();

Le code s’en trouve plus lisible et plus maintenable.

Pour ceux qui font du .NET, cela se rapproche de ce qu’on peut faire avec Linq.

Présentation de Underscore.js

La majorité des développeurs web connaissent jQuery qui est LA librairie JavaScript (en terme de popularité). Nous allons aujourd’hui présenter Underscore.js, une librairie JavaScript qui peut être très complémentaire avec jQuery.

Underscore est une collection de fonctions utilitaires (plus de 80) qui peuvent vous faire gagner pas mal de temps.

Comme jQuery avec le $, les fonctions d’underscore sont disponible dans l’objet _ (il existe une méthode noConflict pour gérer les éventuels conflits avec d’autres librairies).

Voici un exemple avec la fonction uniq qui permet de récupérer un tableau contenant les valeurs distinctes d’un tableau :

_.uniq([1, 2, 1, 3, 1, 4]);
//=> [1, 2, 3, 4]

Il existes des fonctions liés :

  • aux collections,
  • aux objets,
  • aux tableaux,
  • aux fonctions,
  • utilitaires.

Underscore propose notamment les méthodes ES 5 de l’objet array.

Je vous encourage à faire le tour des fonctions proposés qui peuvent s’avérer très utiles (comme par exemple isUndefined, filter (ou select), pluck, max, zip, …)

Liens

  • Getting cozy with underscore.js : Une très bonne présentation de pourquoi et comment utiliser Underscore.js
  • Présentation en 2 parties (en) des fonctions liés aux
  • lodash / lazy.js : des librairies concurrentes copiant les fonctionnalités d’underscore (à priori plus rapide qu’underscore et apportant le support d’autres fonctionnalités comme le support du chargement de modules asynchrones AMD, …)