Cours:Technologies avancées du eLearning 2/exercices/Saisie de nombres

Énoncés dans le support de cours (diapos 16, 19, 21, 24 (première question) et 26).

Un codepen avec tout le code ci-dessous : https://codepen.io/lzbk/pen/gQvNXw

Fonction estChiffre

Nous avons vu plusieurs solutions possibles :

//En utilisant un switch/case
function estChiffre1(car){
   var resultat=false;
   switch(car){
      case "0":
      case "1":
      case "2":
      case "3":
      case "4":
      case "5":
      case "6":
      case "7":
      case "8":
      case "9":
         resultat = true;
   }
   return resultat;
}

function estChiffre2(car){
//en utilisant l'ordre alphabétique (attention ça ne marche pas avec car<"10")
   return (car>="0" && car<="9");
}

function estChiffre3(car){
//en utilisant un tableau des caractères autorisés
   var resultat = false ;
   var tabChiffres = ["0","1","2","3","4","5","6","7","8","9"];
   for(let i=0;i<tabChiffres.length;i++){
      if(tabChiffres[i] == car){
         resultat = true;
      }
   }
   return resultat;
}

function estChiffre4(car){
//avec un if
   var resultat = false;
   if (   car=="0"
       || car=="1"
       || car=="2"
       || car=="3"
       || car=="4"
       || car=="5"
       || car=="6"
       || car=="7"
       || car=="8"
       || car=="9"
    ){
      resultat = true;
   }
   return resultat;
}

Fonction estNombre

Votre fonction est nombre doit passer le test suivant :

console.debug("Test de estNombre()");
console.log("Chaine vide : false attendu → " , estNombre(""));
console.log("romains : false attendu → " ,estNombre("XIV"));
console.log("1 : true attendu → " ,  estNombre("1"));
console.log("123546590143 : true attendu → " ,  estNombre("123546590143"));
console.log("1.62345 : true attendu → " , estNombre("1.62345"));
console.log("-1 : true attendu → " , estNombre("-1"));
console.log("-13240,2303458 : true attendu → " , estNombre("-13240,2303458"));
console.log("12345a12235 : false attendu → " , estNombre("12345a12235"));
console.log("12345-12235 : false attendu → " , estNombre("12345-12235"));
console.log("23.34562.234 : false attendu → " , estNombre("23.34562.234"));
console.log(".345 : true attendu → " , estNombre(".345"));
console.log(", : false attendu → " , estNombre(","));
console.log("- : false attendu → " , estNombre("-"));

Correction

//Prend une chaine de caractère et dit si c'est un nombre
function estNombre(mot){
   //déclaration de variables
       //aVirgule : booléen qui dit si le “mot” comporte (déjà) une virgule
   var aVirgule = mot.charAt(0)==","
                  || mot.charAt(0)==".",
       //resultat : booléen qui dit si le mot est (pour le moment) un nombre
       resultat = estChiffre1(mot.charAt(0))
                  || ( mot.length > 1
                       && (aVirgule || mot.charAt(0)=="-"));
       //On initialise resultat à vrai si le premier caractère est un chiffre ou
         //si c'est une virgule ou un moins, mais que le mot contient d'autres caractères 
   /*On parcourt le reste du mot (mais on s'arrête dès qu'on est sûr que ce n'est pas un
     nombre. Dès que résultat sera faux, (resultat && i<mot.length) sera faux.*/
   for(let i=1;resultat && i<mot.length;i++){
      if(mot.charAt(i)=="," || mot.charAt(i)=="."){
          if(aVirgule){
             resultat = false;
          }
          else{
             aVirgule = true;
          }
      }
      else if(!estChiffre1(mot.charAt(i))){
         resultat = false;
      }
   }
   return resultat;
}

Fonction saisieNombres

Cette fonction demande à l’utilisateur d’entrer des nombres, n’accepte que les nombres et les stocke dans un tableau tant qu’il n’a pas entré "stop" et ensuite renvoie le tableau.

Correction

function saisieNombres(){
  var res = [],
      //initialisation de la boucle
      thePrompt = "Saisissez un nombre",
      input = prompt(thePrompt);
  while (input != "stop"){//condition pour rester dans la boucle
    /*début du traitement*/
    if(estNombre(input)){
      thePrompt = "Saisissez un nombre"
      res.push(input);
    }
    else{
      thePrompt = "On a dit un NOMBRE !!!"
    }
    /*Fin du traitement*/
    input = prompt(thePrompt); //incrément
  }
  return res;
}

ArrayToTableToArray + somme, tri et mélange

fonction ArrayToTable

function arrayToTable(leTableau, idTable){
  var elt = document.getElementById(idTable),res = true;
  if(elt == null){
    //L'identifiant n'existe pas
    console.error("arrayToTable : "+idTable + " n'existe pas dans le document.");
    res = false;
  }
  else if(elt.tagName != "table"){
    //L'identifiant n'existe pas
    console.error("arrayToTable : "+idTable + " n'est pas une table.");
    res = false;
  }
  else{
    //on crée du contenu
    let content =""
    for(let i=0;i<leTableau.length;i++){
      content += "<td>"+leTableau[i]+"</td>";
    }
    //on le met dans l'élément
    elt.innerHTML = "<tr>"+content+"</tr>";
  }
  return res;
}

fonction somme

function somme(tab){
  var res= 0;
  for(let i=0;i<tab.length;i++){
    res += tab[i];
  }
  return res;
}

fonction trier

Je propose deux solution, de tri par sélection il y en a pleiiiiin d'autres beaucoup plus efficaces.

function trierAvecTabIntermédiaire(tab){
  var res = [],//le tableau trié
      idMin=0;//l'index de la valeur min du tableau
  while(tab.length>1){
    //tant qu'on n'a pas vidé le tableau non trié
    for(let i=1;i<tab.length;i++){
      //on recherche l'identifiant de l'élément min du tableau
      if(tab[i]<tab[idMin]){
        idMin=i;
      }
    }
    //quand il est trouvé, on l'ajoute à la fin du tableau trié
    res.push(tab[idMin]);
    //on enlève l'élément trié du tableau non trié
    tab.splice(idMin,1);
    //on se prépare à rechercher l'élément le plus petit
    idMin=0;
  }
  //on prend le dernier élément qui est le plus grand
  res.push(tab[idMin]);
  return res;
}

function trierSansTabIntermédiaire(tab){
  //solution sans tableau intermédiaire
  var idMin=0,//identifiant de la plus petite valeur de la partie non triée du tableau
      idDebTri=0;//identifiant du 1er élément non trié
  while(idDebTri<tab.length-1){
    //tant qu'on n'a pas tout trié
    for(let i=idDebTri+1;i<tab.length;i++){
      //on recherche le minimum de la partie non triée
      if(tab[i]<tab[idMin]){
        idMin=i;
      }
    }
    //quand on l'a trouvée, on intervertit la valeur trouvé avec le contenu de la première case non triée
    let tmpVal = tab[idDebTri];
    tab[idDebTri]=tab[idMin];
    tab[idMin] = tmpVal;
    //la partie non triée commence donc à la case suivante
    idDebTri++;
    //on se prépare à rechercher le minimum
    idMin=idDebTri;
  }
  //la dernière case est mécaniquement triée lors du dernier tour de boucle, puisque l'avant dernière est le minimum
  return tab;
}

function trier(tab){
   //Je choisis une version pour la fonction trier
   return trierSansTabIntermédiaire(tab);
}

fonction tableToArray

Ci-dessous une version qui marche avec des tableaux qui ne sont pas de la forme :

<table><tbody><tr><td>1</td><td>2</td></tr></tbody></table>

function tableToArray(idTable){
  var elt = document.getElementById(idTable),
      res = [];
  if(elt == null){
    //L'identifiant n'existe pas
    console.error("arrayToTable : "+idTable + " n'existe pas dans le document.");
    res = false;
  }
  else if(elt.tagName != "TABLE"){
    //L'identifiant n'existe pas
    console.error("arrayToTable : "+idTable + " n'est pas une table.");
    res = false;
  }
  else{//on a bien un tableau, on va prendre la 1ère ligne, tant pis s'il y en avait plus
    var ligne = elt.firstChild;
    while(ligne != null && ligne.tagName != "TR"){
      if(ligne.tagName == "TBODY"){
        ligne = ligne.firstChild;
      }
      else{
        ligne = ligne.nextSibling;
      }
    }
    ligne = ligne.children
    //avec un tr intermédiaire, on est censés avoir un tableau d'éléments td.
    for(let j=0;j<ligne.length;j++){
      if(ligne[j].tagName="TD"){
        //le innerHTML est une String, on le convertit en nombre
        //(on veut pouvoir en faire la somme)
        res.push(Number(ligne[j].innerHTML));
      }
    }
  }
  return res;
}

fonction randomize

On crée une fonction qui mélange un tableau JS :

function randomize(tab){
  var res = [] ;
  while(tab.length > 1){
     //on tire au sort un entier entre 0 et la longueur du tableau moins 1
     let i = Math.floor(Math.random()*tab.length);
     //on copie dans res la case à cet indice
     res.push(tab[i]);
     //on supprime cette case pour ne pas la re-tirer au sort
     tab.splice(i,1);
  }
  res.push(tab[0])
  return res ;
}

Réutilisation de ces fonctions pour trier et mélanger des tableaux d'un document HTML

sortTable

function sortTable(idTable, idTableTriee){
  //on récupère la table HTML dans un tableau JS
  var tabTemporaire = tableToArray(idTable) ;
  //on trie ce tableau
  tabTemporaire = trier(tabTemporaire) ;
  //on ajoute la somme à la fin
  tabTemporaire.push(somme(tabTemporaire));
  //on met dans le DOM le tableau obtenu
  arrayToTable(tabTemporaire, idTableTriee);
}

randomizeTable

function randomizeTable(idTable, idTableMelangee){
  //on récupère la table HTML dans un tableau JS
  var tabTemporaire = tableToArray(idTable) ;
  //on met la version mélangée de ce tableau dans l'élément d'id idTableMelangee
  arrayToTable(randomize(tabTemporaire), idTableMelangee) ;
}