Premiers pas en JavaScript
condition... SWITCH
cuy copyleft
  See You Why?  

 


Test : conditions complexes (17.9) | | SWITCH expression (18.2)

Contenu


JavaScript 1 - Introduction
JavaScript 2 - Commentaires et instructions
JavaScript 3 - Variables
JavaScript 4 - Types de variables
JavaScript 5 - Variables et chaines
JavaScript 6 - Les fonctions
JavaScript 7 - Les fonctions à paramètre unique
JavaScript 8 - Les fonctions à paramètres multiples
JavaScript 9 - L'instruction RETURN dans une fonction
JavaScript 10 - Appel d'une fonction dans une autre fonction
JavaScript 11 - Les variables locales ou globales
JavaScript 12 - Quelques opérateurs mathématiques
JavaScript 13 - ???
JavaScript 14 - L'instruction IF, pour les conditions
JavaScript 15 - L'instruction IF... ELSE..., pour les conditions à deux sorties
JavaScript 16 - Les IF imbriqués et fonction aléatoire
JavaScript 17 - Les conditions complexes
JavaScript 18 - L'instruction SWITCH, en cas de choix multiples
18.1 JS : L'instruction SWITCH avec variables
18.2 JS : L'instruction SWITCH avec expressions
18.8 JS : exercices sur l'instruction SWITCH
18.9 JS : un test sur l'instruction SWITCH
JavaScript 19 - La boucle FOR
JavaScript 20 - La boucle WHILE
JavaScript 21 - Les événements dans la programmation
JavaScript 22 - Quelques événements : onMouseOver onLoad etc.
JavaScript 23 - Les objets
JavaScript 24 - Créer ses propres objets
JavaScript 25 - Appliquer des méthodes à ses objets
JavaScript 26 - Les tableaux
JavaScript 27 - Différentes façons de créer des tableaux
JavaScript 28 - Propriétés et méthodes applicables aux tableaux
JavaScript 29 - Les méthodes applicables aux tableaux
JavaScript 30 - Méthodes de tris pour tableaux SORT, REVERSE et PUSH
JavaScript 31 - Ajouter des éléments à un tableau en utilisant une boucle
JavaScript 32 - Tecnique pour imprimer les éléments d'un tableau
JavaScript 33 - Lecture de bases de données
JavaScript 34 - Les objets mathématiques
JavaScript 35 - Les objets relatifs aux dates
JavaScript 36 - Les formulaires JS sont des objets
JavaScript 37 - Accès aux éléments d'un formulaire
JavaScript 38 - Validation des entrées d un formulaire
JavaScript 39 - Graphisme et JavaScript

JavaScript 50 - Calculateur d'emprunt
JavaScript 51 - Calendrier perpétuel et options diverses
JavaScript 99 - Documentation


 
 

 
Avec un peu de JavaScript,
n'oubliez pas de rendre vos pages
plus dynamiques et plus interactives.
 

 
 

 
Notre volonté est de rendre cette formation de JavaScript,
disponible le plus rapidement possible.
Le lecteur excusera l'imperfection de ce travail en cours de construction
et pourrait nous informer des défauts rencontrés.

  MERCI
 

 

 

I. L'instruction SWITCH

De nombreux cas peuvent se présenter où les tests à effectuer n'ont pas comme seules réponses possibles vrai ou faux. Les tests peuvent souvent avoir différentes valeurs, toutes à traiter de façon (quasi) équivalentes. Si un de vos élèves répond à une question, votre réaction pourra être différente selon que la réponse émane de Frédéric, Kathia ou Siham...

Ce chapitre a pour but de modifier les procédures selon la valeur qu'aura une variable JS... et vous savez qu'une variable peut contenir des informations aussi diverses que le résultat à un test, le prénom de l'internaute qui visite vos pages, la réponse qu'il aura donné à une de vos questions, son âge, etc.

"Pas de problèmes" me direz-vous, "je connais l'instruction IF, il suffit de la répéter autant de fois que de valeurs prévues pour cette variable". Je ne pourrais que vous féliciter pour cette approche de programmation, mais JS a prévu une procédure plus simple selon la valeur que prendra une variable.

A. la syntaxe de l'instruction SWITCH

Puisqu'il s'agit d'appliquer des procédures différentes selon le cas que prendra une variable (ici, elle s'appelle ma_variable...) voyons la syntaxe du début de l'instruction SWITCH (que l'on pourrait traduire par : "selon la valeur qu'aura la variable ma_variable") :

switch (ma_variable) {
     // ici on listera les diverses valeurs que pourront
     // prendre la variable ma_variable
}

Il ne reste dès lors plus qu'à envisager les différents cas que pourraient prendre la variable... et comme il s'agit de cas, la syntaxe sera :

switch (ma_variable) {
     case "poireaux à étuver" :
          document.writeln("actuellement 0,99 € la botte de 1,2 kg,
              soit à 0,83 €/kg.");
          break;
     case "clémentines" :
          document.writeln("d'origine espagnole à 3,99 € la caisse de 2,3 kg,
              soit à 1,73 €/kg.");
          break;
     case "oignons" :
          document.writeln("des Pays-Bas à 1,19 € la caisse de 5 kg,
               soit en promo à 0,24¢ €/kg.");
          break;
     case "brocoli" :
          document.writeln("espagnol à 0,69 €/500g,
               ou au prix promotionnels de 1,38 € le kilo.");
          break;
     case "melons" :
     case "ananas" :
          document.writeln("de Costa Rica à 1,79 €/pièce.");
          break;
     case "tomates en grappe" :
          document.writeln("en vrac à 1,29 €/kilo.");
          break;
     default :
          document.writeln("Désolé,
                les autres fruits et légumes ne sont pas en promotion aujourd'hui.");
}

Break, pourquoi ce break après chaque cas envisagé... ne l'oubliez pas, il permet d'arrêter de consulter les autres cas dès qu'un cas favorable est rencontré, mais surtout, il marque la fin des instructions à exécuter dans ce cas favorable. À défaut de l'insérer, la consultation des autres cas se poursuit... et l'exécution des instructions des autres cas se fait aussi, ce qui souvent génère une erreur quasi impossible à détecter.
Cependant, cet oubli peut être volontaire : ainsi, si ma_variable prend la valeur "melons", ce sont les instructions relatives à "ananas" qui s'exécuteront... et qui supposent qu'ils ont même origine et même prix...
"Mais le dernier break est inutile, alors..." retorquera le lecteur attentif... et il a raison, mais mieux vaut un break inutile que l'oubli de 25 utiles... si les cas possibles sont nombreux.

default: c'est quoi ce dernier cas ? Au cas où aucun des cas prévus n'est rencontré, l'instruction default: est la réponse à tous les autres cas... "à défaut des autres cas".

Revoyons cet exemple avec des variables numériques.

B. SWITCH avec variables numériques

Ce même SWITCH (au cas où...) est aussi accessible pour des variables numériques, en voici d'ailleurs un exemple qui met en place une redirection, en fonction du jour de la semaine :

   var dateobj=new Date();
   var today=dateobj.getDay();
   switch(today){
      case 1:
         window.location="lundi.htm";
         break;
      case 2:
         window.location="mardi.htm";
         break;
      case 3:
         window.location="mercredi.htm";
         break;
      case 4:
         window.location="jeudi.htm";
         break;
      case 5:
         window.location="vendredi.htm";
         break;
      case 6:
         window.location="samedi.htm";
         break;
      case 0:
         window.location="dimanche.htm";
         break;
}

Quelques explications s'imposent.

var dateobj=new Date(); est une instruction de déclaration d'une variable, ça vous le saviez déjà ;
le new indique la création d'un objet (ou tableau) qui sera susceptible d'avoir des propriétés et des méthodes... c'est ce que nous avions dit en Introduction ;
la fonction Date() prend la valeur que votre ordinateur a en mémoire pour la date et heure actuelle.
Et voilà terminée la déclaration d'un objet date. Cet objet pourra être affecté de diverses propriétés et/ou méthodes. Heureusement, il s'agit d'un objet inclus de façon native dans Javascript (objet prédéfini), et que l'on peut toujours utiliser de façon standard.

Parmi les méthodes prédéfinies pour des objets de type 'date' dans JS, il existe la méthode getDay() qui permet de récupérer la valeur du jour pour la date en question. L'objet retourné est alors un entier qui correspond au jour de la semaine : 0 pour dimanche, 1 pour lundi, etc.
Notre variable today ne pourra donc prendre que des valeurs entières de 0 à 6 pour les jours dimanche à samedi. Intéressant pour le but poursuivi, selon la valeur numérique entière de la variable today, il suffira de rediriger l'internaute vers une page différente selon les cas.
Les autres propriétés et méthodes des objets date seront étudiées dans le chapitre 35. Patience.

Seul un mystère subsiste peut-être, l'emploi de cette étrange instruction JS, à savoir window.location qui suscite de nombreux débats et qui n'a d'autre but que de rediriger l'internaute visiteur de vos pages sur une page précise.
Si toutefois, window.location ne fonctionne pas, essayer les variantes window.location.href ou window.location.replace qui selon les navigateurs donnent des résultats plus performants.

Remarquons ici que les redirections faites en JS sont parfois mal tolérées et peuvent engendrer des effets secondaires non souhaités :
la redirection peut ne pas être opérationnelle,
l'historique des pages visitées peut être détruit (pas de "page précédente" accessible),
les moteurs de recherche (Google et autres) ne suivent pas ces redirections, etc.

Voici donc ce script à tester, ne soyez pas étonnés de l'absence des fichiers de chaque jour... ce sera l'occasion de tester votre bouton "page précédente"... (n'hésitez pas à modifier pour tester les variantes proposées ci-dessus) :

 

Exemple

<html>
<body>

<h1>switch variable numérique</h1>

<script type="text/javascript">

   var dateobj=new Date();
   var today=dateobj.getDay();
   switch(today){
      case 1:
         window.location="lundi.htm";
         break;
      case 2:
         window.location="mardi.htm";
         break;
      case 3:
         window.location="mercredi.htm";
         break;
      case 4:
         window.location="jeudi.htm";
         break;
      case 5:
         window.location="vendredi.htm";
         break;
      case 6:
         window.location="samedi.htm";
         break;
      case 0:
         window.location="dimanche.htm";
         break;
}


</script>


</body>
</html>

 

 

II. Switch avec expressions ou strings

voir suite >>>

 

 

IV. Test relatif aux conditions IF... ELSE...

voir suite >>>

 

 


Test : conditions complexes (17.9) | | SWITCH expression (18.2)