GoupillWiki

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.
====== Syntaxe générale de javascript ======

JS est proche de Python. Nous allons nous concentrer sur ce qui diffère.

===== Commentaires =====

JS utilise la notation de [[nsi:langages:c:start|C]] :

<code javascript linenums>
// Ceci est un commentaire sur une ligne
/*
   Ceci est un commentaire
   pouvant s'étaler sur
   plusieurs lignes.
*/
</code>

===== Calcul élémentaire =====

<code javascript linenums>
let x = 8;
let y = 17;
let z = x + y;
console.log(z);
</code>

[[https://www.typescriptlang.org/play?filetype=js#code/DYUwLgBAHhC8EA4DcAoUkCecIEYDsq6EAXtjANQQaoDGA9gHYDOdoAdMHQOYAUxAlKggQgA|Voir]]

  * ''let'' peut être compris comme "soit". Par exemple en ligne 1, "soit x = 8".\\ On peut aussi utiliser ''var'' pour déclarer les variables. Il y a une [[nsi:langages:js:fonctions|subtilité]] entre ''let'' et ''var''.
  * Les instructions se terminent par '';''. Ce n'est pas absolument obligatoire mais c'est recommandé car en l'absence de '';'', l'interpréteur JS pourra mal comprendre.
  * ''console.log'' permet d'afficher un message en console.\\ En utilisation ordinaire, JS devra plutôt afficher dans une page web mais pour l'instant nous nous contentons de la console.
  * JS n'a qu'un type nombre très général, à la fois pour les entiers et pour les réels. Vous remarquez qu'on ne précise pas le type des variables et une variable peur changer de type, comme dans l'exemple ci-dessous dans lequel ''x'' est d'abord un nombre puis un texte.

<code javascript linenums>
let x = 8;
console.log(x);
x = "a";
console.log(x)
</code>

===== Tests =====

<code javascript linenums>
if (condition) {
    instruction 1;
    instruction 2;
}
</code>

  * la condition est entre ''%%( )%%''.
  * Le bloc est ouvert avec ''%%{%%'' et refermé par ''%%}%%''.

Ce dernier point est important : les retours à la ligne n'est pas obligatoire et les indentations non plus. Ces deux versions sont totalement équivalentes :

<WRAP group>
<WRAP half column>
<code javascript linenums>
if (condition) {
instruction 1;
instruction 2;
}
</code>
</WRAP>

<WRAP half column>
<code javascript linenums>
if (condition) { instruction 1; instruction 2; }
</code>
</WRAP>
</WRAP>

Mais la première est plus lisible.

On peut ajouter un bloc ''else'' et même des blocs ''else if''.

===== Boucle TANT QUE =====

<code javascript linenums>
let nombre = 15;
let i = 2;
while (i < nombre) {
    if (nombre % i == 0) {
        console.log(i)
    }
    i++;
}
</code>

[[https://www.typescriptlang.org/play?ssl=8&ssc=2&pln=1&pc=1&filetype=js#code/DYUwLgBAdg9gtgIwE4ggXggRgKwG4BQokAluhAEwEDuAFsaBABSkA808yIAlBAN74RBEYgDMmsRCggBSYegwAGHvyGqIAYxhQAzjFAA6YDADmzLgKEBfC4OIBqOwUtA|voir]]

Ce programme parcours les entiers inférieurs à ''nombre'' et affiche les diviseurs trouvés.

<WRAP tip>notez que ''%'' est l'opérateur modulo comme en Python. Ainsi ''%%nombre % i == 0%%'' peut se traduire par "i divise nombre"</WRAP>

===== Boucle POUR =====

<code javascript linenums>
let total = 0;

for (let i = 0; i < 9; i++) {
  total = total + i;
}

console.log(total);
</code>

[[https://www.typescriptlang.org/play?filetype=js#code/DYUwLgBGD2YIbAgXggBgNwChMDNoCcIAKUSAS2TXQgoB4IBOasgahYEoIBvTCKWBJRjxELGlgC+2AMbQAdgGdooAHTBoAcyLCE7dEA|voir]]

Le contenu de la déclaration ''for'' a trois morceaux :
  * ''let i = 0'' : déclaration de la variable servant à compter les répétitions et initialisation de sa valeur à ''0''.
  * ''i < 9'' : condition. La boucle POUR se répète tant que la condition est vraie.
  * ''i++'' : modification du compteur. ''i++'' signifie ''i = i + 1''.

Une telle boucle POUR n'est rien d'autre qu'une boucle TANT QUE déguisée :

<code javascript linenums>
let total = 0;

let i = 0
while (i < 9) {
  total = total + i;
  i++;
}

console.log(total);
</code>

Il faut donc faire attention : si on écrit mal les paramètres de ''for'', on peut arriver à une boucle infinie. Par exemple ''for (let i = 0; i > -5; i++)''. La condition ''i > -5'' sera toujours vraie et la boucle n'aura pas de fin.

===== Boucle POUR CHAQUE =====

JS possède une boucle POUR CHAQUE semblable au ''for in'' de Python. Elle vient en deux variantes selon le type de données utilisé.

  * ''for x in E'' quand ''E'' est un dictionnaire. Alors ''x'' parcours les clés.
  * ''for x of E'' quand ''E'' est un tableau -- ''array''