Le JavaScript est très permissif. Mais vous avez reçu un message de Dieu lui-même, et maintenant vous n’utilisez juste qu’un sous-ensemble du langage dans votre code. Mais cela demande de la vigilance.
Une astuce peut vous aider à rester dans le droit chemin : "use strict".
Bien entendu, vous écrivez votre code dans une fonction appelée immédiatement. Ajoutez la chaîne de caractères "use strict"; juste en dessous de cette fonction pour que les interpréteurs des navigateurs modernes deviennent plus exigeants avec celui-ci :
(function(){ "use strict"; // votre code })() |
Pour les navigateurs qui ne connaissent pas cette instruction, c’est juste une string, et c’est ignoré. Pour ceux qui connaissent l’instruction, tout le bloc concerné (ici tout votre code, mais PAS le code en dehors de la fonction, donc pas de risque de planter le code des autres tels qu’un plugin jQuery) sera vérifié.
Parmi les vérifications :
- Définir deux fois le même attribut dans un objet avec la notation littérale.
- Utilisation de
eval(). - Utilisation de
with. - Utilisation de
argumentsandcaller.
Si ces situations sont rencontrées, une exception est levée. Un bon article avec des exemples en anglais ici.
Tous mes codes JS ont maintenant "use strict" par défaut, en plus du plugin SublimeLinter qui me sert de garde-fou supplémentaire.
Je ne connaissais pas mais de toute façon, je n’en vois pas l’intérêt.
eval peut très bien être utilisé, tout comme arguments et caller…
Un bon logiciel qui fait du lint doit détecter plutôt les break manquants, les redefinitions de variables, celles non déclarées avec var, comparaisons non strictes, ; manquants (très utile pour compresser le code)
Et à ce jeu-là, jquery est très très mauvais…
(mode troll ON)
Quand on veut du code propre, on utilise pas Javascript !
(mode troll OFF)
Une fois le code produit, il peut être bien de le passer par JSHint (http://www.jshint.com), qui demande de toute manière le “use strict”; pour ne pas avoir de warning ;)
Bon j’ai l’impression que Ghostery fout sa m… quand je commente ! Alors je recommence.
Je l’avais acheté sous le nom “JavaScript – Gardez le meilleur !”.
Maintenant il est vendu sous un autre nom, mais c’est bien la traduction de “JavaScript: The Good Parts”
“JavaScript – Les bons éléments” : http://www.pearson.fr/livre/?GCOI=27440100598580
@Sil: Et si on veut coder proprement on va se laver les mains, le cul et la bite si l’envie de se tripoter nous prend !
Attention, le mode strict n’est pas toujours souhaitable. Un article à ce sujet : http://scriptogr.am/micmath/post/should-you-use-strict-in-your-production-javascript
@ sil: si seulement on pouvait s’en passer. C’est un de mes fantasmes, j’en pense souvent en me carressant sous la douche.
@Léo Maradan: oui d’ailleurs, ça ferait un bon article. Je l’ai rajouté aux drafts.
@Charles: je suis très dubitatif face aux arguments de l’auteur. Je vois dans son article plus une collection d’excuses, voir de mauvaises pratiques, que de raisons relles. Mais merci de l’avoir signalé, c’est bon d’avoir plusieurs points de vue sur la question.
Y’a aussi l’utilisation de variables non définies qui est interdit en mode strict ; en mode classique ça créé la variable de manière globale et peut être à l’origine de nombreux bugs.
Question bête : si j’ai un fichier js qui contient de nombreuses définitions de fonctions, chacune appelée par une autre quand le besoin s’en fait sentir, et que les premières fonctions à être appelées le sont dans un jQuery(document).ready(function(){}), comment utiliser le “use strict” ? Où le mettre ? Dans ledit jQuery(document).ready(function(){}), car cela définit une fonction appelée dès le chargement de la page, ou bien faut-il quand même encapsuler tout le contenu du fichier dans un (function(){}) ?
Merci d’avance :)
Toujours, toujours, toujours encapsuler tout le fichier.
Après, si tout le code de tout le fichier est dans
jQuery(document).ready(function(){}), ya pas de problème, le use strict peut aller là dedans.Ok, j’encapsule donc, merci !
Et non, tout le code n’est pas dans le jQuery(document).ready(function(){}), pas les définitions de fonctions en tout cas. D’ailleurs j’avais fait un test rapide avec le use strict, j’avais défini une fonction dans le jQuery(document).ready(function(){}) et ça me l’avait reproché.
Bon, en fait, j’ai l’impression de faire n’importe quoi…
J’ai un fichier spécifique pour mon module, avec des fonctions métier, et j’ai aussi un fichier “main.js”, qui contient des helpers, des fonctions appelées un peu partout, des ptits trucs (un preventDefault étendu), des gros (factorisation de création d’une grille avec jQGrid), etc. Et je ne sais pas très bien comment encapsuler correctement.
J’en suis à faire un return avec un objet contenant alias et nom de mes fonctions pour pouvoir les appeler ailleurs, dans le fichier métier, par exemple. J’ai bon ? Si oui, c’est lourd (je devrai modifier le return pour chaque nouvelle fonction dans le pot commun). Si non, quelle est la bonne pratique ?
La bonne pratique est d’avoir un seul espace de nom de nom pour tout le projet. Tu créer un objet à la racine de ton fichier JS principal, et toutes les fonctions sont accessible uniquement par cet_object.la_fonction. Ainsi tu ne pollue pas le namespace global avec plein de fonctions. Et du coup tu peux encapsuler tes fonctions métiers sans te soucier de où elles sont placées.
Hello,
surement interessant, à tester.
Une âme charitable pourrait m’expliquer l’interet de l’encapsulation avec une pincée de pédagogie pour le newbie javascript que je suis ?
(function(){ // votre code })()Merci
Une explication est donnée dans le deuxième lien de l’article.
Effectivement, dimanche matin j’avais un peu la tête dans le c… merci :)