IdentifiantMot de passe
Loading...
Mot de passe oubli� ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les r�ponses en temps r�el, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

bonnes pratiques syntaxe javascript


Sujet :

JavaScript

Vue hybride

Message pr�c�dent Message pr�c�dent   Message suivant Message suivant
  1. #1
    Invit�
    Invit�(e)
    Par d�faut bonnes pratiques syntaxe javascript
    Bonsoir � tous,

    Analyste d�veloppeur orient� POO (Java essentiellement) et DB Oracle (PL/SQL), j'utilise et appr�hende depuis plusieurs mois le langage Javascript.

    Pour un projet commen�ant � prendre de l'importance, je m'efforce de nettoyer les erreurs maladroites et mauvaises pratiques qui se trouve dans le code.

    Un des points important �tant l'utilisation de fonction globales...

    Seulement, apr�s �norm�ment de temps passer � lire sur ce sujet, j'ai appris de nombreuses choses mais certains avis semblent en contradiction et ma vision n'est toujours pas tr�s claire quant � la syntaxe � adopter.

    Pour m'aider, pourriez-vous me donner votre avis sur le petit exemple de code ci-dessous (qui fonctionne mais n�cessite la librairie jquery layout). Est-il correct d'un point de vue bonne pratique? Si non, pourquoi et comment l'�cririez-vous?

    fichier loadcore.js
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
     
    var ns_app = ns_app || {};
    ns_app.createNS("ns_app.core");
     
     
    $(document).ready(function () {
       var layout = new ns_app.core.JQUILayout(true);
       layout.defineMainLayout();
    });
    fichier layout.js
    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    (function($) {
    	ns_app.core.JQUILayout = function(defStyles) {
    		this.defStyles = defStyles;
    	}
     
    	ns_app.core.JQUILayout.prototype.defineMainLayout = function() {
    		$("body").layout({ applyDefaultStyles: this.defStyles });
    	}	
    })(jQuery);
    Ce qui me parait n�cessaire dans le code si j'ai bien compris les bonnes pratiques :
    • l'utilisation de namespaces (en l'occurence deux niveaux ici).
    • l'utilisation de prototype pour ne pas dupliquer les instances de m�thodes.
    • l'utilisation d'une fonction anonyme ex�cut�e automatiquement pour limiter la port�e du code.



    Ce qui me d�range d'apr�s ce que j'ai lu (mais peut-�tre mal compris) :

    • on conseille de toujours pr�c�der la d�claration d'une fonction ou d'une variable par var, mais cette notation ne le permet pas (var ns_app.core.JQUILayout = function... ne fonctionnera pas).
    • Cette syntaxe permet-elle d'avoir des variables et m�thodes priv�es? Si oui comment? ou le tout est-il priv�? Dans quel cas comment rendre une partie publique?
    • On d�conseille l'utilisation de new pour cr�er un nouvel objet, mais je ne vois pas comment me passer de :
      Code : S�lectionner tout - Visualiser dans une fen�tre � part
      var layout = new ns_app.core.JQUILayout(true);


    Beaucoup d'exemples utilisent la notation litt�rale, mais il me semble que cette syntaxe ne permet pas l'utilisation de prototype et donc induit le duplication des m�thodes.

    Qui plus-est, je souhaite pouvoir s�parer le code d'un m�me sous-namespace (ns_app.core) en plusieurs fichiers. Et il ne me semble pas avoir vu de solution avec cette notation.

    Voil�, cela me serait d�j� d'une aide pr�cieuse si vous pouviez m'�clairer par rapport � tout cela. Et si vous remarquez d'autres choses � �viter, n'h�sitez pas � le signaler.


    Un grand merci d'avance.


    Max.

  2. #2
    R�dacteur/Mod�rateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    Novembre 2012
    Messages
    3 375
    D�tails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2012
    Messages : 3 375
    Par d�faut
    Bonsoir Max,

    Ce qui me parait n�cessaire dans le code si j'ai bien compris les bonnes pratiques :
    • l'utilisation de namespaces (en l'occurence deux niveaux ici).
    • l'utilisation de prototype pour ne pas dupliquer les instances de m�thodes.
    • l'utilisation d'une fonction anonyme ex�cut�e automatiquement pour limiter la port�e du code.
    Impeccable, tu as tout compris.



    Ce qui me d�range d'apr�s ce que j'ai lu (mais peut-�tre mal compris) :

    • on conseille de toujours pr�c�der la d�claration d'une fonction ou d'une variable par var, mais cette notation ne le permet pas (var ns_app.core.JQUILayout = function... ne fonctionnera pas).
    • Cette syntaxe permet-elle d'avoir des variables et m�thodes priv�es? Si oui comment? ou le tout est-il priv�? Dans quel cas comment rendre une partie publique?
    • On d�conseille l'utilisation de new pour cr�er un nouvel objet, mais je ne vois pas comment me passer de :
      Code : S�lectionner tout - Visualiser dans une fen�tre � part
      var layout = new ns_app.core.JQUILayout(true);


    Beaucoup d'exemples utilisent la notation litt�rale, mais il me semble que cette syntaxe ne permet pas l'utilisation de prototype et donc induit le duplication des m�thodes.

    Qui plus-est, je souhaite pouvoir s�parer le code d'un m�me sous-namespace (ns_app.core) en plusieurs fichiers. Et il ne me semble pas avoir vu de solution avec cette notation.
    - Il faut en effet utiliser var devant chaque d�claration de variable. Mais quand tu utilises un namespace d�j� d�clar� avec var, il ne s'agit plus d'une d�claration mais de l'ajout d'une propri�t� � ce namespace. Auquel cas il ne s'agit plus d'une d�claration mais d'une affectation. Donc pas besoin de var

    - Pour faire simple, les variables locales de tes fonctions seront tes variables priv�es, tandis que les variables rattach�es au namespace seront publiques. En fait, il s'agit plus d'une question de port�e de variable (on parle aussi de scope de la variable).

    -Je ne sais pas o� tu as lu �a mais l'op�rateur new est tout � fait appropri� pour d�clarer une instance � partir d'une fonction constructeur. De m�me, l'utilisation de prototype est recommand�e pour les objets que tu es amen� � avoir en un grand nombre d'exemplaires (des instances autrement dit). Pour les singletons, la d�claration litt�rale est plus appropri�e. C'est le cas des namespaces par exemple.

    Pour ce qui est de la s�paration en diff�rents fichiers, ce n'est pas un probl�me car si ton namespace est une variable globale, il est rattach� � l'objet window qui est accessible depuis tous tes fichiers. Donc tu peux le r�utiliser dans tous tes fichiers :

    Code : S�lectionner tout - Visualiser dans une fen�tre � part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
     
    //script1.js
     
    (function(ns){
       var a = "privee";
       function privee(){ return a; }
     
       ns.b = "public";
       ns.publique = function(){
         return a + "  ou " + privee() + " ou " + b;
       }
     
    })(window.NAMESPACE = window.NAMESPACE || {})
     
    //script2.js chargé après script1
     
    (function(ns){
       ns.publique(); //pas de souci pour le récupérer
     
    })(window.NAMESPACE = window.NAMESPACE || {})
    Pour la derni�re ligne avec window.NAMESPACE, c'est une simple condition pour initialiser le namespace � un objet vide au cas o� il n'a pas encore �t� d�clar�. Je mets �a pour ne pas avoir � me pr�occuper de l'ordre dans lequel mes fichiers sont appel�s.

  3. #3
    Membre exp�riment�
    Profil pro
    Inscrit en
    D�cembre 2007
    Messages
    128
    D�tails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : D�cembre 2007
    Messages : 128
    Par d�faut
    Salut.

    Citation Envoy� par SylvainPV Voir le message
    - Pour faire simple, les variables locales de tes fonctions seront tes variables priv�es, tandis que les variables propri�t�es rattach�es au namespace seront publiques. En fait, il s'agit plus d'une question de port�e de variable (on parle aussi de scope de la variable) nature : dans un cas tu as une variable (qui a un scope lexical �tant celui de la fonction dans laquelle elle a �t� d�clar�e) dans l'autre tu as une propri�t� (totalement publique).
    Je me permet de rectifier un peu car c'est un peu ambig�e et cela contredit ta phrase pr�c�dente.

    Pour ce qui est du new, il est parfaitement admis de l'utiliser, et au contraire avec les nouvelles �volutions en ES6 il sera m�me de plus en plus pr�sent. Aucune bonne pratiques n'interdit son utilisation, tout ce que tu as lu ce sont des guerres de clocher, il y a souvent des d�bats (durant parfois des mois) sur des mailing list comme JSmentors et je peux t'assurer qu'aucune bonne pratique ne se d�gage, tout au juste quelques trolls non argument�s.

    Le seul probl�me �ventuel que tu pourrait avoir serait un probl�me de pollution du scope global si tu invoque un constructeur en tant que fonction (�-�-d en utilisant "var obj = Obj();" au lieu de "var obj = new Obj();"). Stoyan Stefanov en parle longuement dans un chapitre de "Javascript Patterns" et expose plusieurs solutions. Pour ma part je ne vois pas vraiment l'int�r�t, la rigueur personnelle devrait suffire pour �viter ce genre d'erreurs grossi�res (mais ce n'est que mon opinion).

    Sinon bonne chance pour ton passage au javascript, tu verras c'est un langage tr�s int�ressant et tr�s flexible. Comme tu as un background Java tu aura probablement du mal avec le typage faible, mais rien d'insurmontable. Pour mitiger ce probl�me je te conseille de commenter et typer tes signatures avec JsDoc (l'�quivalent de JavaDoc pour le JS http://usejsdoc.org/ https://github.com/jsdoc3/jsdoc) cela tournera facilement sous Rhino, tu as m�me la tache Ant dispo en t�l�chargement, c'est donc super facile pour un dev Java de faire un build process aux petits oignons.

    Une bonne pratique en JS consiste � privil�gier quand elles existent les notations litt�rales, plus lisibles. Ainsi on pr�f�rera �crire :
    - pour un objet basique "var obj = {key:val, key:val, ... };" plut�t que "var obj = new Object();"
    - pour un tableau "var arr = [val, val, ...];" plut�t que "var arr = new Array();"
    - pour une expression r�guli�re "var regex = /pattern/ig;" plut�t que "var regex = new RegExp('pattern', 'ig');"

    Et enfin �vite l'erreur de d�butants que l'on voit souvent (� cause des gens venant de PHP) qui consiste � m�langer les objets ( {key:val, key:val, ... } ) et les tableaux ( [val, val, ...] ). Pour faire une analogie dis toi que :
    - les objets (notation litt�rale {key:val, key:val, ... } ) sont des Maps
    - les tableaux (notation litt�rale [val, val, ...] ) sont des Lists


    Voila, bon courage � toi !

Discussions similaires

  1. Bonnes pratiques JavaScript
    Par Community Management dans le forum G�n�ral JavaScript
    R�ponses: 185
    Dernier message: 14/09/2016, 18h42
  2. Bonne pratique apprentissage Javascript
    Par t3__rrY dans le forum G�n�ral JavaScript
    R�ponses: 5
    Dernier message: 27/06/2014, 17h04
  3. Bonnes pratiques de s�curit� en JavaScript
    Par Toulousaing dans le forum G�n�ral JavaScript
    R�ponses: 1
    Dernier message: 08/04/2012, 19h47
  4. javascript orient� objet: bonne pratique et h�ritage
    Par negstek dans le forum G�n�ral JavaScript
    R�ponses: 9
    Dernier message: 31/08/2011, 19h27
  5. [POO] Bonnes pratiques href="javascript:fonction()"
    Par LhIaScZkTer dans le forum G�n�ral JavaScript
    R�ponses: 20
    Dernier message: 04/04/2009, 18h26

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo