« Underscore.js » : différence entre les versions
m (→Introduction) |
|||
(6 versions intermédiaires par 2 utilisateurs non affichées) | |||
Ligne 2 : | Ligne 2 : | ||
Underscore.js est une bibliothèque [[JavaScript]] qui a été créé pour fournir au programmateur des fonctions simples et couramment utilisées sans avoir à les recréer dans chaque nouveau programme. | Underscore.js est une bibliothèque [[JavaScript]] qui a été créé pour fournir au programmateur des fonctions simples et couramment utilisées sans avoir à les recréer dans chaque nouveau programme. | ||
Cette bibliothèque est complémentaire au [[JQuery]] et Backbone.js. Elle propose plus d'une centaine de nouvelles fonctions qui ne sont pas nativement présente dans le [[JavaScript]] standard. | Cette bibliothèque est complémentaire au [[JQuery]] et [http://backbonejs.org/ Backbone.js]. Elle propose plus d'une centaine de nouvelles fonctions qui ne sont pas nativement présente dans le [[JavaScript]] standard, même si certaines ont été introduites avec la version ES6 de JavaScript en 2016. | ||
=Installation= | =Installation= | ||
<code>npm install underscore</code> | Underscore peut être utilisé à la fois au niveau Frotend (JavaScript côté-client) et Backend (e.g. [[Node.js]]). Les fonctionnement est exactement le même, mais la modalité d'installation est différente. | ||
===Côté-client=== | |||
La bibliothèque est disponible en téléchargement libre sur le [http://underscorejs.org site] de l'éditeur. Une fois téléchargée, la bibliothèque doit être ajoutée au fichier HTML : | |||
//Version normale | |||
<script src="path/to/underscore.js"></script> | |||
//Ou version minified | |||
<script src="path/to/underscore-min.js"></script> | |||
À ce point, les fonctionnalités de underscore seront disponible avec la variable globale <code>_</code>. Exemples (tiré du site officiel): | |||
<source lang="JavaScript"> | |||
_.last([5, 4, 3, 2, 1]); //--> 1 | |||
var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; }); //--> [2, 4, 6] | |||
</source> | |||
===Avec Node.js=== | |||
Underscore existe également en tant que module [[Node.js]] est peut donc être installée avec npm : | |||
npm install underscore | |||
Comme tout module, pour être ensuite utilisée en Node.js il faudra inclure le module avec la fonction <code>require</code>, e.g.: | |||
var _ = require('underscore'); | |||
=Utilisation= | =Utilisation= | ||
Voici une liste non exhaustive | Voici une liste non exhaustive de quelques exemples de fonctions présentes dans Underscore.js : | ||
*'''map''' | *'''map''' | ||
Cette fonction permet d'appliquer une fonction sur chaque case d'un array sans en modifier sa structure | Cette fonction permet d'appliquer une fonction sur chaque case d'un array sans en modifier sa structure | ||
Ligne 21 : | Ligne 44 : | ||
*'''max''' | *'''max''' | ||
Cette fonction permet de récupérer la valeur | Cette fonction permet de récupérer la valeur maximum d'une liste ou d'un array | ||
<source lang="javascript" enclode="div"> | <source lang="javascript" enclode="div"> | ||
var Array = [2, 4, 6]; | var Array = [2, 4, 6]; | ||
Ligne 29 : | Ligne 52 : | ||
*'''min''' | *'''min''' | ||
Cette fonction permet de récupérer la valeur | Cette fonction permet de récupérer la valeur minimum d'une liste ou d'un array | ||
<source lang="javascript" enclode="div"> | <source lang="javascript" enclode="div"> | ||
var Array = [2, 4, 6]; | var Array = [2, 4, 6]; | ||
Ligne 55 : | Ligne 78 : | ||
*'''first / last''' | *'''first / last''' | ||
Ces fonctions | Ces fonctions permettent respectivement de donner les n premières ou dernières valeurs d'un array. | ||
<source lang="javascript" enclode="div"> | <source lang="javascript" enclode="div"> | ||
var Array = [2, 4, 6]; | var Array = [2, 4, 6]; | ||
Ligne 63 : | Ligne 86 : | ||
// retournera [4, 6] | // retournera [4, 6] | ||
</source> | </source> | ||
=Liens externes= | =Liens externes= | ||
[http://underscorejs.org Site] de l'éditeur et de documentation. | [http://underscorejs.org Site] de l'éditeur et de documentation. | ||
[[Catégorie:JavaScript]] |
Dernière version du 16 juin 2016 à 11:16
Introduction
Underscore.js est une bibliothèque JavaScript qui a été créé pour fournir au programmateur des fonctions simples et couramment utilisées sans avoir à les recréer dans chaque nouveau programme.
Cette bibliothèque est complémentaire au JQuery et Backbone.js. Elle propose plus d'une centaine de nouvelles fonctions qui ne sont pas nativement présente dans le JavaScript standard, même si certaines ont été introduites avec la version ES6 de JavaScript en 2016.
Installation
Underscore peut être utilisé à la fois au niveau Frotend (JavaScript côté-client) et Backend (e.g. Node.js). Les fonctionnement est exactement le même, mais la modalité d'installation est différente.
Côté-client
La bibliothèque est disponible en téléchargement libre sur le site de l'éditeur. Une fois téléchargée, la bibliothèque doit être ajoutée au fichier HTML :
//Version normale <script src="path/to/underscore.js"></script> //Ou version minified <script src="path/to/underscore-min.js"></script>
À ce point, les fonctionnalités de underscore seront disponible avec la variable globale _
. Exemples (tiré du site officiel):
_.last([5, 4, 3, 2, 1]); //--> 1
var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; }); //--> [2, 4, 6]
Avec Node.js
Underscore existe également en tant que module Node.js est peut donc être installée avec npm :
npm install underscore
Comme tout module, pour être ensuite utilisée en Node.js il faudra inclure le module avec la fonction require
, e.g.:
var _ = require('underscore');
Utilisation
Voici une liste non exhaustive de quelques exemples de fonctions présentes dans Underscore.js :
- map
Cette fonction permet d'appliquer une fonction sur chaque case d'un array sans en modifier sa structure
var Array = [2, 4, 6];
Array.map(function(num){ return num * 2; });
// retournera [4, 8, 12]
- max
Cette fonction permet de récupérer la valeur maximum d'une liste ou d'un array
var Array = [2, 4, 6];
Array.max();
// retournera la valeur 6
- min
Cette fonction permet de récupérer la valeur minimum d'une liste ou d'un array
var Array = [2, 4, 6];
Array.min();
// retournera la valeur 2
- filter
Cette fonction permet de filtrer un array sur des valeurs d'intérêt en gardant les valeurs intéressantes.
var Array = [2, 4, 6];
// le signe % est le modulo, soit la division entière.
// "%3" veut donc dire "le reste de la division par 3.
Array.filter(function(num){ return num % 3 == 0; });
// retournera 6
- reject
Cette fonction permet de filtrer un array sur des valeurs d'intérêt en excluant les valeurs intéressantes.
var Array = [2, 4, 6];
Array.reject(function(num){ return num % 3 == 0; });
// retournera [2, 4]
- first / last
Ces fonctions permettent respectivement de donner les n premières ou dernières valeurs d'un array.
var Array = [2, 4, 6];
Array.first(2);
// retournera [2, 4]
Array.last(2);
// retournera [4, 6]
Liens externes
Site de l'éditeur et de documentation.