Mauvaise idée de laisser les appels "console.log ()" dans votre code JavaScript de production?
J'ai un tas d'appels console.log() dans mon JavaScript.
Dois-je les commenter avant de passer en production?
Je voudrais simplement les laisser là, donc je n'ai pas à me soucier de rajouter les commentaires plus tard si j'ai besoin de faire plus de débogage. Est-ce une mauvaise idée?
Cela entraînera des erreurs Javascript, mettant fin à l'exécution du bloc de Javascript contenant l'erreur.
Vous pouvez cependant définir une fonction factice qui est un no-op lorsque Firebug n'est pas actif:
if(typeof console === "undefined") {
console = { log: function() { } };
}
Si vous utilisez des méthodes autres que log, vous devrez également les supprimer.
Comme d'autres l'ont déjà signalé, le laisser entraînera des erreurs dans certains navigateurs, mais ces erreurs peuvent être contournées en insérant des talons.
Cependant, je voudrais non seulement les commenter, mais supprimer carrément ces lignes. Il semble juste bâclé de faire autrement. Je suis peut-être pédant, mais je ne pense pas que le code de "production" devrait inclure du code de "débogage", même sous forme commentée. Si vous laissez des commentaires, ces commentaires doivent décrire ce que fait le code, ou le raisonnement derrière - pas des blocs de code désactivé. (Bien que la plupart des commentaires devraient être supprimés automatiquement par votre processus de minification. Vous minimisez, non?)
De plus, après plusieurs années de travail avec JavaScript, je ne me souviens pas être revenu à une fonction et avoir dit "Gee, j'aurais aimé laisser ces console.logs en place ici!" En général, lorsque j'ai "fini" de travailler sur une fonction et que je dois y revenir plus tard, je reviens pour résoudre un autre problème. Quel que soit ce nouveau problème, si les fichiers console.log d'une précédente série de travaux auraient pu être utiles, j'aurais repéré le problème la première fois. En d'autres termes, si je reviens à quelque chose, je ne suis pas susceptible d'avoir exactement les mêmes informations de débogage que j'avais besoin lors d'occasions précédentes.
Juste mes deux cents ... Bonne chance!
Si vous disposez d'un script de déploiement, vous pouvez l'utiliser pour supprimer les appels à console.log (et réduire le fichier).
Pendant que vous y êtes, vous pouvez lancer votre JS via JSLint et consigner les violations pour inspection (ou empêcher le déploiement).
Ceci est un excellent exemple de la raison pour laquelle vous souhaitez automatiser votre déploiement. Si votre processus vous permet de publier un fichier js contenant console.logs, à un moment donné vous le ferez le ferez.
À ma connaissance, il n'existe pas de méthode plus courte pour éliminer console.log que les 45 caractères suivants:
window.console||(console={log:function(){}});
Il s'agit de la première de 3 versions différentes selon les méthodes de console que vous souhaitez supprimer.Toutes sont minuscules et toutes ont été testées dans IE6 + et les navigateurs modernes.
Les deux autres versions couvrent différentes autres méthodes de console. L'un couvre les quatre bases et l'autre couvre toutes les méthodes de console connues pour firebug et webkit. Encore une fois, dans les plus petites tailles de fichier possibles.
Ce projet est sur github: https://github.com/andyet/ConsoleDummy.js
Si vous pouvez penser à un moyen de réduire davantage le code, les contributions sont les bienvenues.
- EDIT - 16 mai 2012
J'ai depuis amélioré ce code. Il est toujours minuscule mais ajoute la possibilité d'activer et de désactiver la sortie de la console: https://github.com/HenrikJoreteg/andlog
C'était présenté sur The Changelog Show
J'espère que cela aide quelqu'un - j'ai écrit un emballage pour cela il y a quelque temps, c'est légèrement plus flexible que la solution acceptée.
De toute évidence, si vous utilisez d'autres méthodes telles que console.info, etc., vous pouvez reproduire l'effet. lorsque vous avez terminé avec votre environnement de transfert, changez simplement le C.debug par défaut en false pour la production et vous n'aurez pas à changer d'autre code/supprimer des lignes, etc. Très facile à revenir et à déboguer plus tard.
var C = {
// console wrapper
debug: true, // global debug on|off
quietDismiss: false, // may want to just drop, or alert instead
log: function() {
if (!C.debug) return false;
if (typeof console == 'object' && typeof console.log != "undefined") {
console.log.apply(this, arguments);
}
else {
if (!C.quietDismiss) {
var result = "";
for (var i = 0, l = arguments.length; i < l; i++)
result += arguments[i] + " ("+typeof arguments[i]+") ";
alert(result);
}
}
}
}; // end console wrapper.
// example data and object
var foo = "foo", bar = document.getElementById("divImage");
C.log(foo, bar);
// to surpress alerts on IE w/o a console:
C.quietDismiss = true;
C.log("this won't show if no console");
// to disable console completely everywhere:
C.debug = false;
C.log("this won't show ever");
Vous devez au moins créer un mannequin console.log si l'objet n'existe pas, donc votre code ne générera pas d'erreurs sur les machines des utilisateurs sans firebug installé.
Une autre possibilité serait de déclencher la journalisation uniquement en "mode débogage", c'est-à-dire si un certain indicateur est défini:
if(_debug) console.log('foo');
_debug && console.log('foo');
cela semble fonctionner pour moi ...
if (!window.console) {
window.console = {
log: function () {},
group: function () {},
error: function () {},
warn: function () {},
groupEnd: function () {}
};
}
Je suis d'accord que le talon de la console est une bonne approche. J'ai essayé divers plugins de console, des extraits de code, dont certains assez complexes. Ils ont tous eu des problèmes dans au moins un navigateur, donc j'ai fini par utiliser quelque chose de simple comme ci-dessous, qui est une fusion d'autres extraits que j'ai vus et quelques suggestions de l'équipe YUI. Il semble fonctionner dans IE8 +, Firefox, Chrome et Safari (pour Windows).
// To disable logging when posting a production release, just change this to false.
var debugMode = false;
// Support logging to console in all browsers even if the console is disabled.
var log = function (msg) {
debugMode && window.console && console.log ? console.log(msg) : null;
};
Remarque: Il prend en charge la désactivation de la journalisation sur la console via un indicateur. Peut-être pourriez-vous aussi automatiser cela via des scripts de construction. Vous pouvez également exposer l'interface utilisateur ou un autre mécanisme pour inverser cet indicateur au moment de l'exécution. Vous pouvez bien sûr devenir beaucoup plus sophistiqué, avec les niveaux de journalisation, la soumission ajax des journaux en fonction du seuil de journal (par exemple, toutes les déclarations de niveau d'erreur sont transmises au serveur pour y être stockées, etc.).
Beaucoup de ces discussions/questions sur la journalisation semblent considérer les instructions de journal comme du code de débogage et non du code instrumentation . D'où le désir de supprimer les instructions du journal. L'instrumentation est extrêmement utile lorsqu'une application est dans la nature et qu'il n'est plus aussi facile de joindre un débogueur ou que des informations vous sont fournies par un utilisateur ou via le support. Vous ne devez jamais enregistrer quoi que ce soit de sensible, quel que soit l'endroit où il a été connecté afin que la confidentialité/sécurité ne soit pas compromise. Une fois que vous considérez la journalisation comme une instrumentation, elle devient maintenant un code de production et doit être écrite selon la même norme.
Avec des applications utilisant un javascript de plus en plus complexe, je pense que l'instrumentation est essentielle.
Je pensais partager une perspective différente. Laisser ce type de sortie visible au monde extérieur dans une application PCI vous rend non conforme.
Comme d'autres l'ont mentionné, cela générera une erreur dans la plupart des navigateurs. Dans Firefox 4, il ne générera pas d'erreur, le message est enregistré dans la console du développeur Web (nouveau dans Firefox 4).
Une solution de contournement à ces erreurs que j'ai vraiment aimé était de && bug :
var de = true;
var bug = function() { console.log.apply(this, arguments); }
// within code
de&&bug(someObject);
Un Nice one-liner:
(!console) ? console.log=function(){} : console.log('Logging is supported.');