Les conditions if else en JavaScript

Les conditions if else en JavaScript

  1. Objectif

    • Connaitre les structures conditionnelles de type if...else en JavaScript
    • Manipuler les structures conditionnelles de type if...else en JavaScript.
  2. Présentation

    • On appelle structure conditionnelle les instructions qui permettent de tester si une condition est vraie ou non.
    • L’instruction if est la structure de test la plus basique. Elle permet d’exécuter une série d’instructions si une condition est vraie.
    • Les instructions conditionnelles de JavaScript:
    • if
      if-else
      nested-if
      if-else-if

      Ces instructions vous permettent de contrôler le flux de l’exécution de votre programme en fonction de conditions connues uniquement pendant l’exécution.



    d-client=”ca-pub-2041146479004630″
    data-ad-slot=”1219671700″
    data-ad-format=”auto”>

  3. Définition et utilisation

    1. Structure avec un if simple
      • La structure conditionnelle if permet de tester si une condition est vraie. Dans ce cas elle a la valeur booléenne true. Si c’est le cas alors le programme exécute l’instruction qui suit ou le bloc d’instructions qui suit.
      • Syntaxe:
        • // La condition toujours entre parenthèses
          if ( condition ) une_seule_instruction ;
          if ( condition ) {
          	// Un bloc = une ou plusieurs instructions
          	// entre une paire d'accolades
          	instruction_1 ;
          	instruction_2 ;
          }
      • Exemple:
        • if ( true ) alert('C\'est true'); // Affiche C'est true
          if ( false ) alert("C'est false"); // Affiche rien
    2. Structure avec l’alternative else
      • L’instruction if... else permet de choisir entre deux blocs d’instructions lors d’un test logique.
      • L’instruction if... else utilise les opérateurs de comparaison pour des tests de type boolean (vrai/faux).
      • Cette instruction est conditionnelle, elle permet de choisir entre deux blocs d’instructions celui qui sera exécuté selon que la condition passée en paramètre est vraie (true) ou fausse (false).
      • L’instruction if / else exécute un bloc de code si une condition spécifiée est vraie. Si la condition est fausse, un autre bloc de code peut être exécuté.
      • Syntaxe:
        • Les conditions if else en JavaScript

          if (condition) {
          Instruction1
          InstructionN
          } else {
          Instruction1
          InstructionM
          }
      • Exemple :
        • // hasard est un nombre aléatoire compris entre 0 et 100
          hasard = Math.round(100*Math.random())
          // Si hasarf vaut 7, on écrit 'hasard vaut 7'
          if ( hasard == 7 ) {
          document.write('hasard vaut 7' + '<BR>')
          // Sinon, on écrit 'hasard ne vaut pas 7'
          } else {
          document.write('hasard ne vaut pas 7' + '<BR>')
          }
    3. Structure avec l’alternative else if
      • Il est possible de mettre les tests de conditions “les uns à la suite des autres” avec autant de else if que l’on veut.
      • Syntaxe :
        • // Si condition_1
          if ( condition_1 ) {
          	// premier bloc
          // sinon si condition_2
          } else if ( condition_2 ) {
          	// deuxième bloc
          // sinon si condition_3
          } else if ( condition_3 ) {
          	// troisième bloc
          // sinon
          } else {
            // quatrième bloc
          }
      • Exemple :
        if ( false )
          alert(1); 
        else if ( false )
          alert(2);
        else
          alert(3); // Affiche 3
    4. Structure nested-if
      • Un if imbriqué est une instruction if qui est la cible d’un autre if ou else.
      • Les instructions if imbriquées signifient une instruction if dans une instruction if. Oui, JavaScript nous permet d’imbriquer des instructions if dans des instructions if. c’est-à-dire que nous pouvons placer une instruction if dans une autre instruction if.
      • Syntaxe :
        • if(condition1) 
          {
             // S'exécute lorsque la condition1 est vraie
             if(condition2) 
             {
                // S'exécute lorsque la condition2 est vraie
             }
          }
      • Exemple :
        • <script type = "text/javaScript"> 
          // Programme JavaScript pour illustrer l'instruction imbriquée-if
          var i = 10;  
          if (i == 10) { 
            // Première instruction if
            if (i < 15) 
              document.write("i is smaller than 15"); 
            // Nested - instruction if 
            // Ne sera exécuté que si la déclaration ci-dessus 
            // c'est vrai
            if (i < 12) 
              document.write("i est aussi plus petit que 12"); 
            else
              document.write("i est supérieur à 15"); 
          } 
          < /script> 

    Dans le cas ou il n’y a qu’une instruction, les accolades sont
    facultatives.
    ☛Il est possible d’imbriquer des structures conditionnelles (la forme
    généralisée)
    ☛ Une autre syntaxe pour exprimer une condition :
    (expression) ? instruction1 : instruction2
    Si l’expression entre parenthèse est vraie, l’instruction1 est exécutée.
    Si l’expression entre parenthèses est fausse, c’est l’instruction2 qui est
    exécutée.

  4. Applications

    1. A1
      • Dans un programme Javascript demander à l’utilisateur de saisir trois chiffres
      • Le programme doit afficher le maximum de ses trois chiffres
      • <!doctype html>
        <HTML>
        <HEAD>
        <TITLE>la structure IF</TITLE>
        </HEAD>
        <BODY>
        
        <script language="javascript">
        var a= window.prompt("Entrez un premier entier :","");
        var b= window.prompt("Entrez un deuxième entier :","");
        var c= window.prompt("Entrez un troisième entier :","");
        
        if (Number(a)>Number(b))
        {
         m=a;
         }else
        {
         m=b;
        }
        if (Number(c)>Number(m))
        {
         m=c;
        }
        
        alert("le maximum de "+a +" , "+b +" et "+c +" est = "+m);
        
        </script>
        </BODY>
        </HTML>
    2. A2
      • Créer le programme JavaScript suivant :
      • Si l’heure est inférieure à 20h00, créez une salutation “Bonne journée”, sinon “Bonne soirée”:
      • La salutation doive être affectée à une variable avant d’être affichée
      • <!doctype html>
        <HTML>
        <HEAD>
        <TITLE>la structure IF</TITLE>
        </HEAD>
        <BODY>
        
        <script language="javascript">
        var time = new Date().getHours(); 
        if (time < 20) {
            saluer = "Bonne journée";
        } else {
            saluer = "Bonne soirée";
        alert(saluer);
        }
        </script>
        </BODY>
        </HTML>
    3. A3
      • Créer une page HTML5 , contenant un formulaire qui demande à un visiteur d’entrer un nombre compris entre 0 et 99
      • Un script JavaScript doit annoncer si le nombre saisie est inférieur,égal ou supérieur 80
      • <!doctype html>
        <HTML>
        <HEAD>
        <TITLE>la structure IF</TITLE>
        </HEAD>
        <BODY>
         
        <script language="javascript">
        var chiffre = prompt("Saisir un nombre compris entre 0 et 99"); 
        if (chiffre > 80) {
            alert(" Le nombre"+chiffre+ " est supérieure à 80");
        } else if (chiffre < 80){
            alert(" Le nombre"+chiffre+ " est inférieure à 80");
        }
        else{
            alert(" Le nombre"+chiffre+ " est égale à 80");
        }
        </script>
        </BODY>
        </HTML>



Abonnez vous à notre chaîne YouTube gratuitement