
Les structures de contrôle
Vous êtes ici : Accueil / Cours / Cours de Javascript / Débuter en Javascript
Nous allons maintenant aborder une notion fondamentale du cours : les structures de contrôle. Javascript est un langage évolué et supporte les mêmes structures de contrôle qu’en C ou PHP :
Les structures conditionnelles
Il existe différents types de structures conditionnelles. Les structures if, switch et nous verrons l’opérateur ternaire
if..else
La structure conditionnelle la plus simple est le if. Sa syntaxe est la suivante :
// Code exécuté si la condition est vraie
}
La condition est un booléen. Cela aussi bien être une variable booléenne qu’une expression comportant des opérateurs conditionnels.
Bien qu’ils ne soient pas des booléens, Javascript considérera comme vrai tout nombre différent de 0, toute chaîne de caractères non vide et tout objet. Ainsi, le code suivant affichera une boite de dialogue :
alert( 'Condition bonne' );
}
Il est possible de rajouter un bloc else qui correspondra au code à exécuter si la condition n’est pas vraie.
// Code exécuté si la condition est vraie
}
else {
// Code exécuté si la condition est fausse
}
Il est parfois nécessaire de vérifier de multiples conditions l’une après les autres. Il existe pour cela une syntaxe if....else if...else
// Code exécuté si la condition est vraie
}
else if( condition2 ) {
// Code exécuté si la première condition est fausse
// et si la seconde condition est vraie
}
else if( condition 3 ) {
// Code exécuté si les 2 premières conditions sont fausses
// et si la troisième condition est vraie
}
else {
// Code exécuté si aucune des conditions ne sont vraies
}
NB : Le else est optionnel. Vous pouvez très bien ne pas vouloir exécuter de code si aucune condition n’est vérifiée.
switch...case
Le switch case permet d’exécuter du code en fonction de la valeur d’une donnée. Exemple :
case ma_valeur1 :
// Code à exécuter si ma_variable vaut ma_valeur1
break;
case ma_valeur2 :
// Code à exécuter si ma_variable vaut ma_valeur2
break;
default :
// Code à exécuter si ma_variable ne vaut
// aucune valeur présentée
}
Remarque 1 : La partie default est optionnelle.
Remarque 2 : Faites bien attention à la présence du break. En effet, en l’omettant, à partir du moment où une des valeurs est bonne, toutes les instructions des blocs suivants seraient exécutés. Exemple :
switch( ma_variable ) {
case 5 :
alert( 'Le bloc 5 est exécuté' );
case 6 :
alert( 'Le bloc 6 est exécuté' );
break;
case 7 :
alert( 'Le bloc 7 est exécuté' );
default :
alert( 'Le bloc par défaut est exécuté' );
}
Dans l’exemple précédent, le résultat sera Le bloc de 5 est exécuté et Le bloc de 6 est exécuté. En effet, le break a été omis dans le bloc de la valeur 5.
Attention ! en face des case se mettent les valeurs possibles de la variable et non des conditions. Ainsi, le code suivant affichera Le bloc par défaut est exécuté.
switch( ma_variable ) {
case ma_variable == 5 :
alert( 'Le bloc 5 est exécuté' );
case ma_variable == 6 :
alert( 'Le bloc 6 est exécuté' );
break;
case ma_variable == 7 :
alert( 'Le bloc 7 est exécuté' );
default :
alert( 'Le bloc par défaut est exécuté' );
}
En effet, par exemple, ma_variable == 5 retourne un booléen, or ma_variable est un entier. Le switch va comparer un entier à un booléen et voir que le résultat n’est pas le même. Il en est de même avec chaque condition. La seule solution pour que le code fonctionne correctement aurait été de mettre true à l’intérieur des parenthèses du switch. Ainsi, la première assertion vérifiée aurait été vérifiée.
L’opérateur ternaire
Bien qu’étant un opérateur, nous allons présenter cette syntaxe ici car elle permet de créer des ruptures de séquences. Voici sa syntaxe :
Par exemple :
L’opérateur ternaire n’apporte pas de nouvelle fonctionnalité, mais permet d’alléger la syntaxe pour de simples alternatives.
Les structures d’itérations
Il existe un certain nombre de structures qui permettent d’exécuter des blocs de code en boucle jusqu’à ce qu’une condition de sortie soit vérifiée. Nous allons les voir dans cette partie.
while
Le while permet d’exécuter le code qui est entre ses accolades tant que la condition entre ses parenthèses est vraie. Exemple :
while( i > 0 ) {
alert( i );
i--;
}
Le code précédent va afficher successivement 5, 4, 3, 2, 1
do...while
Il est parfois nécessaire d’exécuter au moins une fois le code avant de tester la condition. Pour cela, il existe la syntaxe do...while
do {
alert( i );
i--;
}
while( i > 0 );
Le code précédent va avoir exactement le même résultat que que l’exemple du while. La grande différence est que la condition est exécutée à la fin.
for
Il arrive fréquemment de devoir exécuter une boucle avec un incrémentation d’une variable. La boucle for gère l’incrémentation de cette variable. Sa syntaxe est la suivante :
// Code à exécuter pour un nombre limité d'itérations
}
Les boucles for sont souvent utilisées lorsque l’on connaît d’avance le nombre d’itérations du bloc de code à exécuter.
Voici un exemple de son utilisation :
alert( i );
}
Le code précédent affiche successivement 0, 1, 2, 3 et 4. Beaucoup de développeurs se posent la question du nombre exact d’itérations : en effet, il suffit que l’inégalité ne soit pas stricte pour qu’il y aie une itération de plus. Sachez une fois pour toutes que pour exécuter un nombre n d’itération, ayez recours au code suivant :
alert( i );
}
Ce code affiche les nombres de 0 à n-1, donc exécute en tout n itérations.
Les imbrications
Il est tout à fait possible d’imbriquer les structures de contrôle, c’est à dire les mettre les unes dans les autres.
L’exemple suivant affiche les tables de multiplication :
for( var j=0; j<10; j++ ) {
alert( i + 'x' + j + '=' + ( i*j ) );
}
}
Il affichera successivement 0x0=0, 0x1=0, 0x2=0....
Et maintenant
Vous pouvez actuellement reproduire n’importe quel traitement algorithmique. Il reste cependant beaucoup de notions à aborder, notamment toute la gestion des événements pour interagir avec une page web. Le plus dur reste à venir...



