Debug et log javascript à travers la console de Firebug

Debug et log javascript à travers la console de Firebug

Vous connaissez Firebug ? Alors voilà comment l’utiliser pour le développement Javascript et surtout comment utiliser les canaux de sortie de la console de Firebug.

Firebug est à Firefox, ce qu’est la cerise sur le gâteau. C’est l’outil in-dis-pens-able qui vous permet de débuger vos développements web. Et bien sur débuger du javascript au quotidien c’est pas une mince affaire. J’aime beaucoup la fonction alert(), mais il y a plus simple 😉 .

En fait , grâce à la console incluse dans firebug, les possibilités sont infinies. Mais voyons comment l’utiliser comme sortie standard des petits messages que l’on aime bien afficher pour tester des variables ou récupérer les erreurs, et pour cela il y a la méthode.

console.log()

ex: console.log('x = 10');

La méthode console.log() envoie le message ‘x = 10’ à la console. Simplement mais utilement.

console.debug()

ex: console.debug('Erreur: variable x = 0');

La méthode console.debug() envoie le message ‘Erreur: variable x = 0’ à la console Firebug comme log(), mais en plus fournit le numéro de la ligne.

console.info()

ex: console.info('Je suis passé par la !');

La méthode console.info() envoie le message ‘Je suis passé par la !’avec l’icône « information » dans le flux général. Le canal info peut être isolé en cliquant sur ‘info’ dans la liste des canaux.

console.warn()

ex: console.warn('SyntaxError: octal literals and octal escape sequences are deprecated');

console.warn() envoie les messages d’attention. Ces messages sont fournis sur un fond de couleur jaune pour les repérer plus facilement

console.error()

ex: console.error('Erreur : TypeError: queue[i] is undefined');

console.error() affiche un message d’erreur sur fond rose, c’est bien pratique pour s’y retrouver et regarder là ou ça coince.

Chacune des méthodes ci-dessus accepte comme argument un objet javascript, un tableau, ou une simple chaine. C’est extrêmement plus simple que de jouer avec des alertes ou de l’affichage de variables dans le contenu même de la page.

Voilà un exemple de syntaxe pour imprimer des digits (%d) sans une chaine, à la print_f php.
console.log(« Le %d produit as une veleur de: %d », myProduct, myValue);

Bon debug !