Le blog

Netapsys Devoxx 2015

Le Devoxx France 2015 se tenait du 8 Avril au 10 Avril à Paris, au Palais des Congrès.

Cette plateforme est offerte aux développeurs principalement Java pour se retrouver et partager sur plusieurs sujets aux moyens de Conférences, Labs etc. Elle permet de prendre le pool de ce qui se fait dans le monde informatique en termes d’utilisation de Frameworks, d’Outils et de Best Practices.

J’ai pu assister à la journée du Mercredi 8 Avril et la conférence de M. Thierry Chatel(@Thierry Chatel) intitulé « Comprendre enfin  JavaScript ».

Comme plusieurs personnes, je suis un développeur qui a commencé à utiliser le JS à travers le Framework JQuery qui grâce à ces différents plugins facilitent les interactions utilisateur sur les pages Web.

JS est un langage orienté objet mais sans classes comme Java, non typé et fonctionnel.

Cette conférence a eu pour but de rappeler les fondements de JS, de mettre des noms sur des principes que nous utilisons tous les jours ou donner des Best Practices mis en place dans les Frameworks qui composent nos applications.

Mode strict : « use strict »

En tout début de fichier ou  au début d’une fonction, cette instruction permet d’activer un mode rigoureux qui signale plus d’erreurs (fail-fast) comme des variables non déclarées, ne transforme pas this en objet (window n’est pas utilisé à la place de undefined comme objet global) et impose certaines règles comme l’unicité des propriétés dans un objet littéral, ou des noms d’arguments dans une fonction.

var

Le mot clé var est utilisé pour déclarer une variable non typée.

point-virgule ( ; )

Le point-virgule ( ; ) marque la fin d’une instruction. Il peut être omis mais c’est déconseillé car JS ajoute automatiquement les points-virgules manquants et cela provoquer des situations cocasses.

Que renvoie cette fonction ?

undefined est renvoyée car un « ; » est ajouté juste après le return. Il est également ajouté automatiquement

1. en fin  de ligne, de fichier, ou avant une accolade fermante (}).
2. Seulement si le token suivant crée une erreur de syntaxe
3. Jamais dans l’entête d’une boucle for
4. Jamais quand le point-virgule crée une instruction vide
5. Insertion automatique là où une fin de ligne est interdite (une Postfix Expression ++/--,  un continue/break, un return, un throw)

L’insertion automatique des « ; » manquants ne peut être désactivée.

Scope

Une variable est déclarée pour toute la fonction qui la contient et elle existe même avant la ligne où se trouve le mot clé var.

Une variable déclarée hors de toute fonction devient une propriété du scope global. (window est le scope global dans les navigateurs Web).

Objets

Les objets sont des maps clés/valeurs. La clé est une chaîne de caractères correspondant au nom de la propriété et la valeur est quelconque non typé. Toutes les propriétés sont publiques.

La valeur d’une propriété peut être accédée avec obj[‘cle’] ou obj.cle

Un objet peut être créé avec des accolades et les objets peuvent être imbriqués.

Ajout ou modification d’une propriété : obj.key3 = ‘value3’ ou obj[key3] = ‘value3’

Suppression d’une propriété : delete obj.key3 ou delete obj[key3]

La recherche d’une propriété se fait d’abord dans l’objet courant, puis dans son prototype, puis dans le prototype de son prototype, puis dans le prototype du prototype de son prototype …

L’affectation d’une valeur à une propriété modifie ou crée la propriété toujours dans l’objet courant, même si c’est une propriété héritée d’un prototype.

Objetc.prototype est la racine des chaînes de prototypes

Fonctions

Déclaration :  function en début d’instruction + nom de la fonction obligatoire + pas de valeur

La fonction est définie dès le début de la fonction qui la contient sinon dès de le début du fichier

Expression : mot-clé function dans une expression (pas en début d’instruction) + nom facultatif + la valeur retournée est la fonction. La fonction est définie seulement après l’évaluation des expressions.

Les fonctions sont des objets JS. Ils peuvent être mis dans une variable,  dans la propriété d’un objet, dans un tableau. Ils peuvent renvoyer des fonctions ou passer comme paramètre d’une fonction.

aFunction.call(this, arg1, arg2, arg3); // appel de la function en fournissant comme paramètre this et les paramètres un par un

aFunction.apply(this, [arg1, arg2, arg3]); // appel de la function en fournissant comme paramètre this et un tableau de paramètres

Les fonctions call et apply sont utilisées pour des appels récursifs par exemple pour parcourir différents éléments d’un élément et effectuer un traitement.

Closure

Toute fonction JS a accès aux données du scope dans lequel il est défini.

_this est accessible dans la fonction interne car c’est une variable du scope dans lequel la function est définie. La fonction garde une référence vers son scope de définition et les données sont celles présentes au moment de l’exécution de la fonction.

Cela peut provoquer des fuites de mémoire car JS purge le scope à la sortie de la fonction parente.

Anonymous Wrapper

Les fonctions anonymes sont  exécutées immédiatement. Les arguments ne sont pas obligatoires.

Ou

Ce sont des expressions de fonctions au lieu de déclarations, d’où l’utilisation de parenthèses.

Cela permet de créer un scope contenant les variables et les fonctions. L’usage est d’encapsuler le contenu de chaque fichier JS dans un anonymous wrapper.

Pattern Module

C’est une anonymous factory appelée immédiatement permettant de créer et de renvoyer un objet avec des propriétés et des méthodes publiques et qui a accès aux variables locales (données et fonctions privées) du module.

Opérateurs

obj && obj.fn permet d’accéder à une propriété si et seulement si l’objet est défini .

Si obj est équivalent à true, renvoie obj.fn sinon renvoie obj.

arg1 || {} permet d’utiliser une valeur par défaut.  Si arg1 est équivalent à true, renvoie arg1 sinon {}

Exceptions

Un seul catch utilisé pour tout type d’exception. Le bloc finally est facultatif

Une exception peut être déclenchée avec throw "Erreur" ou throw new Error(message), Error étant un objet avec une méthode toString()

Patterns

Duck typing :

Les prototypes sont utilisés pour partager du code. Cela correspond à une fonction générique effectuant un traitement sans se baser sur le type.

Mixins :

Configuration object :

C'est utilisé pour passer un objet en argument avec un code beaucoup plus maintenable et lisible

Au lieu de $myAjaxCall( ‘GET’, ‘/call’) ;

Promesses :

Utilisé pour gérer l’asynchronisme, l’objet retourné correspond à un résultat asynchrone. Il ne contient jamais le résultat avec un méthode then pour enregistrer un callback de succès ou un callback d’erreur. On appelle then que la méthode soit en attente ou déjà résolu.

Types

Il y a 5 types primitifs : boolean, number, string, null, undefined

undefined si aucune valeur n’est affectée, null utilisée explicitement pour indiquer l’absence d’objet. Le type numérique est sur 8 octets et il n’y a pas de types caractère.

Les primitifs : passage par valeur avec une copie de la valeur

Les objets : passage par référence

L’autoboxing est utilisée avec une conversion en Objets de types String, Boolean, Number . Ces types ne doivent pas être utilisés explicitement.

Comparaisons

Il existe deux types de comparaison

=== comparaison stricte sans conversion automatique : « true » pour des données primitives du même type et même valeur, pour des références au même objet et « false » dans les autres cas.

== comparaison avec conversion automatique de type : pour deux objets, une comparaison de références est faite, s’il y a un opérande primitif alors null == undefined si un opérande number ou un boolean, tout est converti en number, si un opérande string, tout est converti en string.

Tableaux

Les tableaux sont des objets initialisés avec des crochets ( [] ). Comme tous les objets, ils ont des propriétés dont les noms sont des chaînes de caractères.

Ex : var emptyArray = [] ; var myArray = [‘java’, ‘script’];

myArray [1]; => script

La propriété length permet d’avoir la taille du tableau. Elle est augmentée lorsqu’on ajoute un index trop grand et lors de la modification de length, les index trop grands sont supprimés.

Le Devoxx France est une occasion idéale pour revoir quelques fondamentaux comme j'ai pu le faire avec le Javascript , de découvrir un sujet qui vous intéresse à l'occasion d'un TP, de voir la mise en oeuvre d'un outil que vous pouvez utiliser dans vos projets. Cela permet également de rencontrer quelques entreprises et de découvrir ce qu'elles font sur leur stand et de revoir d'anciens collègues 🙂

A très bientôt pour de nouvelles aventures 😉