1. Commencer par télécharger cette page Web presque vide.
   Placer ce fichier dans un dossier spécifique sur votre ordinateur.
   Ouvrir ce document à la fois sur Visual Studio Code et sur un navigateur.

2. Test dans le head :
   Rajouter la ligne suivante dans le head puis relancer la page pour voir l'effet :

   <script>alert("Au secours !!");</script>

3. Test dans le body :
   Supprimer la ligne précédemment rajoutée dans le head.
   Rajouter la ligne suivante dans le body puis relancer la page pour voir l'effet :

   <script>alert("Au secours !!");</script>

4. Test dans un fichier JavaScript séparé :

   1. Créer un fichier JavaScript (d'extension .js) dans un répertoire nommée js et contenant cette ligne de code unique :

      alert("Au secours !!");

   2. Au niveau du fichier HTML, supprimer la ligne précédemment rajoutée dans le body.

   3. Au niveau du fichier HTML, rajouter la ligne suivante dans le head en précisant le chemin précis permettant d'accéder depuis le fichier HTML au fichier JavaScript créé au niveau de l'attribut src.
      

      <script src="lien (chemin+fichier)vers le JavaScript"></script>

Tester les trois méthodes séparément puis en même temps sur un fichier html à votre disposition.

1. Ajouter le code suivant à votre fichier de travail :

   <script>console.log("oh, j'écris dans la console !!!");</script>

   Si vous ajoutez le code précédent dans le head ou le body, il faut écrire les balises <script> et </script>.

   Si vous voulez ajouter le code précédent dans un fichier JavaScript séparé, il ne faut écrire que le contenu de la balise <script>, c'est-à-dire ne ne saisir ni <script>, ni </script>.

   Dans toute la suite de ce cours (hormis lors de la définition de fonctions), les balises <script> et </script> seront écrites afin de mieux différencier le code JavaScript du code HTML, même s'il est souvent préférable de gérer tout le JavaScript dans un fichier séparé d'extension .js.

2. Qu'observez vous en appuyant sur la touche F12 ?

Écrivez ce code :

<script>
    let maVar2;
    console.log(maVar2);
    maVar2 = 3
    console.log(maVar2);
 </script>

Expliquez le undefined qui s'affiche au niveau de la console.

Écrivez ce code :

<script>
    let maVar=true;
    console.log(maVar);
    maVar=maVar+maVar;
    console.log(maVar);
</script>        

Expliquez le 2 apparu dans la console.

Écrivez le code suivant :

<script>
    let maVar2 = "j'ai changé de valeur !"
    console.log("maVar2 :", maVar2);
    {  // début d'un bloc 
        let maVar3 = "je suis nouvelle";
        maVar2 = " je suis modifiée dans le bloc";
        console.log("maVar2 :", maVar2);
        console.log("maVar3 :", maVar3);
    }   // fin du bloc
    console.log("maVar2 :", maVar2);
    console.log("maVar3 :", maVar3);       
</script>        

1. Expliquez le message d'erreur envoyé par la console.

2. Modifiez le code pour que la variable s'affiche dans la console sans enlever les accolades.

Écrire le code suivant :

<script>
    const maVar4;
</script> 

Expliquez le message d'erreur présent dans la console.

Expliquez le message d'erreur envoyé par ce script.

<script>
    const maVar = "je suis une constante !";
    console.log(maVar);
    maVar = "Puisque je vous dis que je suis une constante !!!"
</script>            

Écrivez le code suivant :

<script>
    const tabl = [];
    console.log(tabl);
    tabl.push(1);
    console.log(tabl);
    tabl.push(2);
    console.log(tabl);
    tabl.push("j'ai compris");
    console.log(tabl);
</script>        

Expliquez ce que fait la méthode push.

1. Créer un fichier JavaScript et y insérer le code définissant la fonction carrée de l'exemple 7 au-dessus.

2. Créer dans un fichier html un lien dans le head vers ce fichier JavaScript.

3. Dans le fichier html, au niveau du body, ajouter le script de l'exemple 8 précédent.

4. Visualiser dans un navigateur le résultat.

5. Que permet la fonction JavaScript write() ?

Rajouter le code suivant afin de découvrir comme premier événement le Click.

<p onclick="alert('METTRE DE LA COULEUR');">Cliquez ici</p>

1. Télécharger ce fichier HTML, puis compléter les cinq zones ... (4 au niveau du script JavaScript et 1 au niveau du bouton) afin de rendre le code fonctionnel.

2. Tester le script de sorte d'obtenir sur navigateur et console, on résultat similaire à celui de cette image :

3. Modifier au niveau du HTML les deux valeurs de $a$ et de $b$ afin de vérifier la validité de la fonction complétée.