console JS

Ouvrir la console de firefox.

Vous pouvez ouvrir la console firefox par la touche F12 (ou en passant par le menu "Développement web").

Le navigateur utilisé comme calculatrice.

Ouvrez la console js comme expliqué précédemment.

Testez quelques calculs :
calculs
Math.pow(a,n) retourne la valeur de aⁿ.

Utilité.

Cette première utilisation de la console peut être utile à chaque fois que l'on veut tester une commande. C'est une aide au débugage. La console firefox est toutefois plus utile pour les messages d'analyse affichée sur la page. Pour tester du code javascript, on utilisera plutôt l'ardoise javascript de firefox.

Analyser un script simple.

Créez un nouveau fichier html. Appelons le "bug.html".

Entrez le texte suivant dans le fichier (ouvert avec un éditeur de texte bien sûr). Il s'agit d'un script affichant les carrés des premiers entiers.

<!doctype html>

<html>
<head>
    <meta charset="utf-8">
    <title> Un script JS avec erreur </title>
</head>

<body>

    <p>  Affichage des carrés des premiers entiers. </p>
    <script>
        for(let i = 0; i < 10; i += 1){
            document.write( pow(i,2) + " ");
        }
    </script>

</body>
</html>

Ouvrez maintenant la page bug.html obtenue avec firefox. La page affiche le paragraphe mais pas les carrés des premiers entiers car le script contient une erreur.

Ouvrez la console. Le problème est normalement affiché : pow est une fonction qui n'existe pas. La fonction correcte est Math.pow.

Corrigez le fichier source et retestez.

Qu'est ce qu'un bug ?

Lorsqu'on programme, on peut faire divers types d'erreurs. Notamment des erreurs de syntaxe et des erreurs de logique.

Convenons dans un premier temps d'appeler bug chacune de ces erreurs.

Débuguer (ou déboguer), c'est chercher à éliminer ces erreurs.

Pour tout ce qui relève des erreurs de syntaxe (oubli d'un point-virgule, parenthèse non fermée...), il existe des outils efficaces qui vous aideront à les trouver.

Débugueur en ligne

Il existe des outils permettant de tester facilement vos scripts en ligne et constituant une aide au débugage.

Certains de ces outils vous proposent de réécrire proprement vos scripts (indentation régulière, respect de certaines normes de codage...). Cela a l'importante conséquence de rendre le code plus lisible.

N'hésitez pas à vous en servir.

Javascript en ligne

Avec js fiddle, vous pouvez tester en ligne du javascript et même enregistrer et m'envoyer l'adresse de la page si vous avez des questions à poser sur votre code.

Idem avec JSbin.