• Javascript

    ES6 : les modules

    Lorsqu’une application JavaScript commence à prendre de l’ampleur il devient de plus en plus difficile de l’organiser et de la gérer. Il est alors judicieux de la découper en petits morceaux fonctionnels plus faciles à manipuler et dont l’intendance pose moins de problèmes. Au-delà du découpage en fonctions et classes on peut aussi découper le code en modules cohérents ayant un certain niveau d’abstraction. D’autre part un module embarque son intendance et devient facile à utiliser et réutiliser. JavaScript ne connaît malheureusement pas les espaces de noms qui existent dans de multiples langages. Avec ES5 on peut s’en sortir avec les objets et les fermetures et il existe une multitude…

  • Javascript

    ES6 : les classes

    Jusqu’à ES5 JavaScript ignore les classes et l’héritage classique. Avec ES6 on va disposer désormais de quelque chose qui se rapproche vraiment de ce qui existe dans les autres langages, même s’il s’agit juste d’une autre syntaxe pour un système objet qui reste fondamentalement le même et on peut parler ici de simulation parce que les prototypes restent toujours aux commandes ‌! Les classes ES6 introduit le mot-clé class pour créer une classe. Voici un ‌exemple : class User { constructor(name) { this.name = name; } salut() { alert('Coucou ' + this.name + ' !'); } } Si vous pratiquez des langages comme C#, Java, ou même PHP, vous ne devez…

  • Javascript

    ES6 : les promesses

    JavaScript est doué pour la programmation asynchrone. Il dispose des événements et des fonctions de retour. Avec ES6 arrivent également les promesses. On va voir cet aspect dans le présent chapitre. La programmation asynchrone Avant de vous parler des promesses on va un peu faire le point sur la programmation asynchrone… Depuis son origine JavaScript est destiné à accomplir des tâches asynchrones pour le web, par exemple lorsqu’un utilisateur clique sur un bouton. Avec node.js on retrouve cette approche asynchrone côté serveur. A la base JavaScript ne fonctionne qu’avec un thread, c’est à dire qu’à un moment donné un seul code est exécuté, contrairement à d’autres langages comme Java ou…

  • Javascript

    ES6 : boucles, itérations et générateurs

    Avec ES6 on a une nouvelle instruction de boucle : for-of. On dispose aussi de l’itération. Faisons le point dans ce chapitre. La boucle for-of Avec ES5 on a déjà plusieurs possibilités pour faire des boucles : for, do…while, while, for…in, forEach. Que nous apporte de plus for-of ? L’instruction for-of fonctionne sur des objets itérables (Array, Map, Set, String) et est destinée à remplacer for-in et forEach. La syntaxe est simple : let tableau = [1, 2]; for (let element of tableau) { console.log(element); // 1 2 } On peut utiliser break et continue dans cette boucle. A l’intérieur de la boucle on dispose de la clé et de…

  • Javascript

    ES6 : les collections avec clés (set et map)

    Avec ES5 JavaScript n’a qu’un seul type de collection : les tableaux. Le souci c’est que les tableaux ont juste une indexation numérique, on ne peut pas utiliser des clés. Alors il est toujours possible d’utiliser les objets, qui ne sont pas faits pour ça à la base, pour contourner cette limitation. ES6 introduits deux types de collections dont une avec des ‌clés pour combler cette lacune. Les ensembles (set) Un ensemble (set) est une collection de valeurs distinctes. On peut parcourir ces valeurs dans l’ordre et savoir si une valeur particulière est présente. Création d’un ensemble Un ensemble est très facile à créer avec le constructeur Set et à garnir…

  • Javascript

    ES6 : la déstructuration

    Quand on utilise JavaScript on fait beaucoup usage des objets et tableaux. Il arrive également souvent qu’on ait besoin de certaines informations d’un objet ou d’un tableau dans des variables. On peut évidemment le faire avec ES5, mais on va voir dans ce chapitre que ES6 nous offre un outil bien pratique : la destructuration.‌ Déstructurons un objet Vous avez un objet et vous voulez extraire ses données. Avec ES5 vous procédez ainsi : var identite = { nom: 'Durand', prenom: 'Pierre' }; var nom = identite.nom; var prenom = identite.prenom; console.log(nom); // Durand console.log(prenom); // Pierre On a un code simple mais il pourrait rapidement s’alourdir avec un objet…