JavaScript

Sapiens Group vous présente sa vision du langage JavaScript mais également de nombreuses solutions très en vogue en ce moment et fortement maîtrisées par les consultants Sapiens Group.

1. JavaScript est OPEN-SOURCE 

Souvent abrégé JS, le langage JavaScript est un langage de scripts utilisés la plupart du temps dans les pages web.

Etant un langage orienté objet et prototypé, Il peut être aussi utilisé coté serveur.

Langage prototypé car les essentiels du langage sont représentées par des objets. Cependant Ces objets ne sont pas des instances de classe. Chaque objet est doté d’un constructeur qui permet de mettre en place ses propriétés et de créer des prototypes pour faire hériter des objets personnalisés.

Ce qui nous amène à dire que les fonctions implémentées sont des entités de premières classes. C’est à dire qu’elles peuvent être utilisées sans restriction.

• JavaScript, un bon choix ?

Comme tout langage informatique, le JavaScript contient certaines particularités qui lui sont propres et très profitables. On peut citer :

-La portée des variables : la portée des variables se repend au niveau des fonctions où elles sont déclarées. Ce qui revient à dire qu’une variable déclarée dans le corps d’une méthode reste utilisable n’importe où dans la fonction. En ce qui concerne les fonctions imbriquées, la portée des variables déclarées dans les fonctions parents s’étend dans les fonctions secondaires mais l’inverse non.

-Les fonctions anonymes : Tout est dans le nom. C’est une fonction qui n’a pas de nom et qui peut exécuter tous ce qu’on lui demandera dans le script.

-Encapsulation : N’embarquant pas nativement les namepace (espaces de nommage), il existe une méthode permettant d’éviter de déclarer des variables existantes éventuellement dans les plugins importés. Cette méthode consiste à encapsuler la bibliothèque dans une fonction anonyme. Ce qui revient à limiter la portée de la variable et des fonctions (cf. La portée des variables) à la portée de la fonction principale (première fonction parent).

-Closures : les closures ou encore fermetures représentent une caractéristique très inconnue des débutants mais surtout ils sont d’une très puissante utilité. Il permet d’accéder à des variables qui ne sont pas à la portée de la fonction hôte (la fonction qui veut réutiliser les variables hors de sa portée).

 

2. Les composants JavaScript et leurs intérêts

Le langage JavaScript a su s’imposer au fil du temps. Notamment dans les mises en places de fonctionnalités dynamiques avec HTML5.

Cependant certaines bibliothèques JavaScript permettent de se simplifier la tâche et de coder plus rapidement en obtenant un résultat plus qu’espérer. Parmi elles on cite :

–JQuery : La bibliothèque JQuery est faite en JavaScript et elle met en avant, avec ces diverses fonctionnalités, l’interaction dynamique entre le JavaScript et le HTML. Parmi ces fonctionnalités on a :

• La manipulation du css en ajoutant ou supprimant des classes ou attributs initialement inclus dans des éléments
• La gestion des événements qui nous permet d’exécuter un script quelconque qui sera déclencher par un événement (clique, survol etc.).
• La gestion des DOM (Document Object Model) : JQuery peut parcours les fichiers XML (ou HTML), avoir « full-Access » au contenu de ces derniers afin de pourvoir les restructurer, modifier, traiter etc.

–Webix UI: La bibliothèque Webix permet de mettre en place des applications HTML5/Css3 adaptés à la fois aux ordinateurs mais aussi à certains systèmes d’exploitation mobiles comme IOS, Androïd, Blackberry même si son domaine de prédilection reste le web. Utilisé aussi coté serveur, Webix ne dépend pas du langage utilisé coté serveur et donc se met en place facilement avec le Ruby, le Java, l’ASP.NET ou encore le PHP.

-Underscore.js: Underscore.js est une librairie JavaScript qui procure un ensemble de fonctionnalités d’aides aux programmeurs sans étendre les objets natifs. Il fournit plus de 80 fonctions qui prennent en chargent les fonctionnalités habituels : MAP, SELECT, INVOKE, mais aussi des fonctionnalités plus avancées telles que le JavaScript templating, le binding.

Il délègue les fonctions natives aux navigateurs qui en prennent la charge afin que l’implémentation soit native dans le navigateur. Il y’a entre autres : forEach, map, reduce indexOf, every, filter et some

-Backbone.js: La bibliothèque Bakcbone.js est basé sur Underscore.js et permet de concevoir la structure d’une application web en un assemble de vu autonomes. L’un de ses atouts est le fait qu’il est facilement utilisable avec d’autres bibliothèques. Il embarque plusieurs composants pouvant s’intégrer avec d’autres Framework. Parmi ces composants on en distingue 3 :

• Model: Il permet de gérer du contenu tel qu’un objet JavaScript. Il met en avant l’encapsulation et propose des méthodes de types accesseurs (getters & setters).

• Collection: Il permet de gérer les collections faites avec le composant ci-haut, Bakcbone.Model. Il conserve les méthodes habituelles : push, pop, shift, unshift, add remove length, get et sort.

• Sync: Backbone.Sync permet de synchroniser les objets, avec une API. La plus utilisée est REST (Json). Pour ce faire il a besoin d’une ressource, comme tout fonctionnement avec un web service. La ressource avec Backbone.Sync se déclare grâce à l’attribut url. Cette ressource permettra de lier les objets et les collections.

-Angular.js: Angular.Js est une bibliothèque libre JavaScript tel que Prototype ou encore Mootools. Son objectif principal est de mettre en place une syntaxe simplifiée de JavaScript et rajouter à ce dernier des fonctionnalités qu’il ne gère pas de bases. Il synchronise automatiquement les modèles et les vues. Pour ce faire il utilise un data-binding bidirectionnel qui agit sur le HTML et en utilise le contenu dynamique. Angular.JS utilise la conception MVC. Angular.JS est connu pour son aptitude à mettre en place des applications légères. De ce fait Angular.JS restitue certains rôles, qui à la base sont gérés par le serveur, au client. Comme les contrôleurs de vues. Ce qui rend la partie admin du site plus souple. Cela est nommé l’injection de dépendances. Il n’est pas préférable de mettre en place une bibliothèque JS en accompagnement avec Angular.JS. Toutefois, il reste possible et même aisé d’ajouter des touches de Framework plus discrets, tels que JQuery, même si il est conseillé de le faire une fois la partie Angular.Js développée et après s’être assuré que Angular.JS ne propose pas d’alternative satisfaisante.

-Less: Less est un langage permettant de dynamiser la mise en place des feuilles styles. La syntaxe du langage Less est semblable au CSS. Il apporte certaines nouveautés comme la déclaration de variables ou encore les mixins (ils permettent d’associer une classe css à une autre classe, en appliquant les propriétés de la première classe à la seconde), les imbrications (imbrication des sélecteurs dans d’autres sélecteurs), les opérateurs et aussi des fonctions. Le langage Less est open source. Le code Less peut être compilé de différèrent manière. Il peut être compilé comme un fichier css ou coté serveur ou encore coté client.

-D3 (Data-Driven Documents) : la bibliothèque D3 est une librairie JavaScript qui permet de manipuler des documents relativement basés sur des données. La bibliothèque D3 permet d’afficher ces données sous représentation graphique et dynamique. Son principal atout est qu’il est conforme aux normes W3C. Il utilise notamment SVG, JavaScript et du CSS.

 

3. JavaScript : Evolution, histoire

De son nom originel LiveScript, le langage JavaScript a vu le jour en 1995 grâce à Netscape. Sa première version n’est utilisée que par Netscape 1.0. LiveScript est renommé en JavaScript à partir de la deuxième version de Netscape et sera pris en charge par Explorer 3.

En 1997 JavaScript 2.0 voit le jour et a pour but de répondre aux normes ISO/IEC 16262.

JavaScript 3.0 se penchera sur la gestion d’exceptions et sur une utilité plus avancée des structures.

Mozilla 1.* prendra en charge JavaScript 1.5 ainsi que Netscape 4.* – 7.*

Au début des années 2000 on notera l’arrivée de XMLHttpRequest sur la plupart des navigateurs permettant donc à ces derniers de pouvoir recharger dynamiquement une page ou une partie de la page. Ce qui sera nommé Ajax.

Cependant avec les différences qui régnaient entre les navigateurs le langage JavaScript n’était pas accessible à tous. Ce qui entraine l’arrivée des Framework telles que JQuery, Mootools, Prototype. Ces derniers apporteront la possibilité de parcourir des éléments d’une page en utilisant les propriétés css. On notera aussi d’autres fonctionnalités de hautes envergures telles que la gestion d’événements (clique, survol, submit etc.), appels de fonctions Ajax.

Un standard du langage sera mis en place pour que le fonctionnement du langage JavaScript soit le même dans tous les navigateurs qui le prendront en charge.

Il fallait prendre en compte les extensions les plus importantes et proposer des fonctionnalités qui pourront permettre au JavaScript de s’imposer dans ce monde virtuel. Cela était sous la responsabilité du comité TC39. Le langage qui en découlera sera nommé ECMAScript.

Fin 2009 le comité TC39 lance ECMAScript 5. Sous la pression des géants du web (Google, Yahoo et Microsoft) qui voulait créer leur propre comité afin de faire avancer le langage, le comité TC39 trouve une solution aux fameux problèmes qui régnaient entre les membres du comité sur les mésententes concernant la publication de cette dernière version.

ES5 embarque des fonctionnalités opérateurs sur des collections. Ce qui sera son atout majeur. On cite entre autres filter (). Cette dernière prend en paramètre une fonction et renvoie une collection formés par les éléments qui seront conservés par la fonction qui est mis en paramètre.

 

4. Sécurité

Comme nous l’avons dit un peu plus haut, le langage JavaScript est interprété par le navigateur. Et c’est lui qui s’occupe par exemple d’afficher des erreurs lorsqu’on a mal remplit un formulaire.

Il existe un minimum de sécurité intégré à JavaScript comme par exemple un utilisateur n’a pas accès aux variables déclarés dans le script d’un autre site quelconque encore moins voir les autres pages ouvertes par le même navigateur. Un utilisateur ne peut pas non plus accéder au registre de Windows ou écrire sur le disque.

Cependant il n’en va pas de même pour les développeurs. Le code JavaScript est visible par tout le monde et il est aussi éditable. Le développeur doit prêter attention à ses scripts js afin de ne pas y glisser des informations personnels.

Les vérifications des données doivent être faites côté serveur. JavaScript peut s’assurer de la validité des formats de données mais ne peut pas en assurer la validité nécessaire que requiert les parties restreintes du site. Ceci dit, il est impératif d’effectuer d’autres vérifications des éventuelles données utilisateurs.

En ce qui concerne la visibilité du code, certains développeurs arrivent à encoder leur script afin qu’il ne soit pas lisible. Cependant il existe des outils qui permettent de décoder les scripts et en rétablir la vue.

 

5. JavaScript sur la toile

• Notoriété du JavaScript

Au fil du temps le langage JavaScript a su s’imposer grâce à ses nouvelles fonctionnalités qu’ils proposent au web, notamment dans les animations d’interfaces utilisateurs mais aussi dans les opérations d’améliorations de l’expérience utilisateur.

Le langage JavaScript est le Plus souvent utilisé avec du HTML5. Les nouvelles fonctionnalités HTML5 sont semblables à quelques une apportées par le langage JavaScript. Ce qui fait gagner au HTML5 du terrain et réduit l’utilisation du langage JavaScript. Cependant cela ne concerne pas la totalité des fonctionnalités de JavaScript. Il en resterait une grande partie que le HTML5 ne saurait pas encore géré. Parmi les fonctionnalités semblables nous avons la validation des champs des formulaires ou encore les expressions régulières de validation de champs spécifique comme les emails.

• Indépendance du JavaScript

Le langage JavaScript est un langage web mais il n’a pas pour but cependant de mettre en place des sites web de A à Z. JavaScript intervient la plupart du temps dans les opérations dynamiques sur les interfaces utilisateurs. Ce qui nous amène à dire que JavaScript est un « langage d’accompagnement ». A lui seul il n’est pas d’une grande utilité mais associer à des langages tels que le HTML5 ou encore côté serveur comme le PHP5 il permet d’exploiter des fonctionnalités très indispensables.

Comme nous l’avons dit plus haut, il est impératif de vérifier les données utilisateurs lorsqu’on notre site est interactif. Le langage JavaScript ne permet pas à lui seul d’effectuer la totalité des opérations de contrôle d’intégrité de validité de confidentialité et d’authenticité.

• Compétence sur le marché

Le langage JavaScript a su se montrer incontournable au fil du temps, du fait de sa simplicité et de son pouvoir d’adaptation à la majorité des langages serveurs. La plupart des développeurs maitrisent ou connaissent un minimum du langage JavaScript. Le JavaScript a su apporter sa touche sur les attentes concernant l’amélioration de l’expérience utilisateur. Cela étant la tendance du web actuelle, la majorité des développeurs s’orientent au JavaScript. Ils seraient aussi attirés par les nouvelles fonctionnalités que JavaScript met en place dans ces dernières versions.

 

Un avis ! Une question ? Nos experts Sapiens Group sont à votre écoute. Contactez-nous ou Donnez-nous votre avis !