Structure du code

La premire chose apprendre est de construire des blocs de code.

Instructions

Les instructions sont des constructions de syntaxe et des commandes qui effectuent des actions.

Nous avons dj vu une instruction alert("Hello World!") qui affiche le message.

Nous pouvons avoir autant dinstructions dans le code que nous le souhaitons. Une autre instruction peut tre spare par un point-virgule.

Par exemple, ici nous divisons le message en deux :

alert("Hello"); alert("World");

Chaque instruction est gnralement crite sur une ligne distincte le code devient donc plus lisible :

alert("Hello");
alert("World");

Les points-virgules

Un point-virgule peut tre omis dans la plupart des cas lorsquune rupture de ligne existe.

Cela fonctionnerait aussi :

alert("Hello")
alert("World")

Ici, JavaScript interprte le saut de ligne comme un point-virgule implicite. Cela sappelle galement une insertion automatique de point-virgule.

Dans la plupart des cas, une nouvelle ligne implique un point-virgule. Mais dans la plupart des cas ne signifie pas toujours!

Il y a des cas o une nouvelle ligne ne signifie pas un point-virgule, par exemple :

alert(3 +
1
+ 2);

Le code gnre 6, car JavaScript ninsre pas de point-virgule ici. Il est intuitivement vident que si la ligne se termine par un plus "+", alors cest une expression incomplte, donc un point-virgule serait incorrect. Et dans ce cas, cela fonctionne comme prvu.

Mais il existe des situations o JavaScript choue prendre un point-virgule l o il est vraiment ncessaire.

Les erreurs qui surviennent dans de tels cas sont assez difficiles trouver et corriger.

alert("Hello");

[1, 2].forEach(alert);

alert("Hello")

[1, 2].forEach(alert);

alert("Hello")[1, 2].forEach(alert);

Il est recommand de mettre les points-virgules entre les instructions, mme si elles sont spares par des nouvelles lignes. Cette rgle est largement adopte par la communaut. Notons encore une fois il est possible de laisser de ct les points-virgules la plupart du temps. Mais il est plus sr surtout pour un dbutant de les utiliser.

Les Commentaires

Au fil du temps, le programme devient de plus en plus complexe. Il devient ncessaire dajouter des commentaires qui dcrivent ce qui se passe et pourquoi.

Les commentaires peuvent tre placs nimporte quel endroit du script. Ils naffectent pas lexcution, car le moteur les ignore simplement.

Les commentaires sur une ligne commencent par deux barres obliques //.

Le reste de la ligne est un commentaire. Il peut occuper une ligne complte ou suivre une dclaration.

Comme ici :

// Ce commentaire occupe une ligne  part
alert("Hello");

alert("World"); // Ce commentaire suit l'instruction

Les commentaires multilignes commencent par une barre oblique et un astrisque /* et se termine par un astrisque et une barre oblique */.

Comme ceci :

/* Un exemple avec deux messages.
C'est un commentaire multiligne.
*/
alert("Hello");
alert("World");

Le contenu des commentaires est ignor, donc si nous mettons du code lintrieur /* */ il ne sexcutera pas.

Parfois, il est utile de dsactiver temporairement une partie du code :

/* Commenter le code
alert('Hello');
*/
alert("World");

/*
  /* commentaire imbriqu ?!? */
*/
alert( 'World' );

Nhsitez pas commenter votre code.

Les commentaires augmentent la taille globale du code, mais ce nest pas un problme du tout. De nombreux outils permettent de rduire le code avant de le publier sur le serveur de production. Ils suppriment les commentaires, ils napparaissent donc pas dans les scripts de travail. Les commentaires nont donc aucun effet ngatif sur la production.

Plus loin dans le tutoriel, il y aura un chapitre Style de codage qui explique galement comment crire de meilleurs commentaires.