Je me retrouve à coder un gros projet en Javascript. Je me souviens que la dernière était une aventure car JS hacky peut rapidement devenir illisible et je veux que ce code soit propre.
Eh bien, j'utilise des objets pour construire une bibliothèque, mais il y a plusieurs façons de définir des choses dans JS, impliquant des conséquences importantes dans la portée, la gestion de la mémoire, l'espace de noms, etc. EG:
- utiliser
var
ou non; - définir des éléments dans le fichier ou dans un
(function(){...})()
style jquery; - en utilisant
this
ou non; - en utilisant
function myname()
oumyname = function()
; - définir des méthodes dans le corps de l'objet ou utiliser "prototype";
- etc.
Quelles sont donc les meilleures pratiques lors du codage en OO dans JS?
Des explications académiques vraiment attendues ici. Les liens vers les livres sont les bienvenus, tant qu'ils traitent de qualité et de robustesse.
ÉDITER :
J'ai quelques lectures, mais je suis toujours très intéressé par les réponses aux questions ci-dessus et toutes les meilleures pratiques.
la source
Réponses:
Utiliser `var` ou non
Vous devez introduire n'importe quelle variable avec l'
var
instruction, sinon elle atteint la portée globale.Il convient de mentionner qu'en mode strict (
"use strict";
), les affectations de variables non déclarées sont lancéesReferenceError
.À l'heure actuelle, JavaScript n'a pas de portée de bloc. L'école de Crockford vous apprend à placer des instructions var au début du corps de la fonction , tandis que le guide de style de Dojo indique que toutes les variables doivent être déclarées dans la plus petite portée possible . (L'
let
instruction et la définition introduites dans JavaScript 1.7 ne font pas partie de la norme ECMAScript.)Il est recommandé de lier les propriétés des objets régulièrement utilisés aux variables locales car cela est plus rapide que de rechercher toute la chaîne de portée. (Voir Optimisation de JavaScript pour des performances extrêmes et une faible consommation de mémoire .)
Définir des choses dans le fichier, ou dans un `((fonction () {...}) ()`
Si vous n'avez pas besoin d'accéder à vos objets en dehors de votre code, vous pouvez envelopper tout votre code dans une expression de fonction - c'est ce qu'on appelle le modèle de module. Il présente des avantages en termes de performances et permet également de réduire et masquer votre code à un niveau élevé. Vous pouvez également vous assurer qu'il ne polluera pas l'espace de noms global. Les fonctions d'habillage en JavaScript vous permettent également d'ajouter un comportement orienté aspect. Ben Cherry a un article détaillé sur le modèle de module .
Utiliser «ceci» ou non
Si vous utilisez l'héritage pseudo-classique en JavaScript, vous pouvez difficilement éviter de l'utiliser
this
. C'est une question de goût quel modèle d'héritage vous utilisez. Pour d'autres cas, consultez l'article de Peter Michaux sur les widgets JavaScript sans "ceci" .Utilisation de `function myname ()` ou `myname = function ();`
function myname()
est une déclaration de fonction etmyname = function();
est une expression de fonction affectée à une variablemyname
. Cette dernière forme indique que les fonctions sont des objets de première classe, et vous pouvez faire n'importe quoi avec elles, comme avec une variable. La seule différence entre elles est que toutes les déclarations de fonctions sont hissées au sommet de la portée, ce qui peut être important dans certains cas. Sinon, ils sont égaux.function foo()
est une forme abrégée. Pour plus de détails sur le levage, consultez l'article JavaScript Scoping and Hoisting .Définir des méthodes dans le corps de l'objet ou utiliser "prototype"
C'est à vous. JavaScript a quatre modèles de création d'objets: pseudo-classique, prototypique, fonctionnel et pièces ( Crockford, 2008 ). Chacun a ses avantages et ses inconvénients, voir Crockford dans ses conversations vidéo ou obtenir son livre The Good Parts comme Anon l'a déjà suggéré .
Cadres
Je vous suggère de choisir des frameworks JavaScript, d'étudier leurs conventions et leur style, et de trouver les pratiques et les modèles qui vous conviennent le mieux. Par exemple, le Dojo Toolkit fournit un cadre robuste pour écrire du code JavaScript orienté objet qui prend même en charge l'héritage multiple.
Motifs
Enfin, il existe un blog dédié à l' exploration des modèles et anti-modèles JavaScript courants . Consultez également la question Existe-t-il des normes de codage pour JavaScript? dans Stack Overflow.
la source
let
instruction et la définition introduites dans JavaScript 1.7 ne font pas partie de la norme ECMAScript." Maintenant, cela fait partie d'ES6.Je vais écrire quelques trucs que j'ai lus ou mis en application depuis que j'ai posé cette question. Ainsi, les gens qui le liront ne seront pas frustrés, car la plupart des réponses sont déguisées par le RTMF (même si je dois admettre que les livres suggérés SONT bons).
Utilisation Var
Toute variable est censée être déjà déclarée à l'étendue supérieure dans JS. Donc, quand vous voulez une nouvelle variable, déclarez-la pour éviter les mauvaises surprises comme la manipulation d'une variable globale sans la remarquer. Par conséquent, utilisez toujours le mot clé var.
Dans un objet make, var la variable private. Si vous souhaitez simplement déclarer une variable publique, utilisez
this.my_var = my_value
pour le faire.Déclarer des méthodes
En JS, ce sont de nombreuses façons de déclarer des méthodes. Pour un programmeur OO, le moyen le plus naturel et le plus efficace consiste à utiliser la syntaxe suivante:
À l'intérieur du corps de l'objet
Il y a un inconvénient: les fonctions internes ne pourront pas accéder à "ceci" en raison de la portée JS amusante. Douglas Crockford recommande de contourner cette limitation en utilisant une variable locale conventionnelle nommée "that". Alors ça devient
Ne comptez pas sur la fin de ligne automatique
JS essaie d'ajouter automatiquement
;
à la fin de la ligne si vous l'oubliez. Ne comptez pas sur ce comportement, car vous obtiendrez des erreurs qui sont un gâchis à déboguer.la source
Vous devez d'abord lire la programmation basée sur un prototype afin de savoir à quel type de bête vous avez affaire, puis jeter un œil au guide de style JavaScript sur MDC et à la page JavaScript sur MDC . Je trouve également préférable de forcer la qualité du code avec un outil, c'est-à-dire. JavaScript Lint ou autres variantes.
Les meilleures pratiques avec OO semblent plus que vous voulez trouver des modèles plutôt que de vous concentrer sur la qualité du code, alors regardez la recherche Google: modèles javascript et modèles jQuery .
la source
Vous voudrez peut-être consulter Secrets of the JavaScript Ninja par John Resig (jQuery). "Ce livre est destiné à prendre un développeur JavaScript intermédiaire et à lui donner les connaissances dont il a besoin pour créer une bibliothèque JavaScript multi-navigateur, à partir du sol."
Le projet est disponible auprès de l'éditeur: http://www.manning.com/resig/
Douglas Crockford a également de beaux articles JavaScript sur sa page d'accueil: http://www.crockford.com/
la source
Je me sens souvent comme le seul gars ici qui utilise MooTools pour mon javascript.
Il signifie M y O bjet O riented Outils, Mootools.
J'aime vraiment leur vision de la POO en javascript. Vous pouvez également utiliser leur implémentation de classe avec jquery, vous n'avez donc pas à abandonner jquery (bien que mootools le fasse tout aussi bien).
Quoi qu'il en soit, donnez une bonne lecture au premier lien et voyez ce que vous en pensez, le deuxième lien est vers les documents mootools.
MooTools et héritage
Classes MooTools
la source
Voici un livre qui couvre la plupart des bases:
Javascript orienté objet pour des applications et des bibliothèques de haute qualité
la source