Traduire un algorithme...
...En un langage informatique
Les alogorithmes permettent de conceptualiser une réponse ou une solution à une question ou un problème
en se détachant des contraintes de la langue ou des contraintes propres à chaque langage
informatique.
Une fois la réponse ou la solution trouvée, il suffit de "traduire" l'algorithme obtenu dans le langage
de transposition souhaité.
Cette traduction, comme pour toute langue, va nécessiter d'avoir un certain vocabulaire et des connaissances en grammaire, relativement basique pour un langage informatique mais très stricte afin d'éviter de mauvaises interprétations.
...En JavaScript (JS)
Javascript est un langage client, ce qui signifie que c'est le "client" (le navigateur utilisé) qui se
charge
de "décoder" et d'exécuter le(s) script(s) fournis.
Cela facilite son apprentissage car à contrario
d'un langage serveur (comme PHP), il n'y a rien besoin de plus : pas de serveur en charge de décoder
le script pour en fournir un fichier exploitable par le client (= navigateur).
JavaScript VS PHP
JavaScript | PHP | |
---|---|---|
Basé sur le langage C | oui | oui |
Besoin d'un serveur | non, le client interprête et exécute | oui |
Définir une zone | <script type="text/javascript" language="JavaScript"> ...instructions... </script> |
<?php ...instructions... ?> |
Déclaration
La déclaration en JavaScript ne permet pas de préciser le type qui va être contenu dans la variable. Cette déclaration se fait de deux manières, chacune utilisant un mot clef :
- var ma_variable;
- let ma_variable;
Il existe une différence majeure entre les deux (le scope) mais au niveau de ce cours, les deux vont être considérés comme identiques. Afin de simplifier ce cours, l'utilisation du mot clé "let" sera privilégié.
En algo :
Variable taille_panier : entier Variables montant, tva, montant_tva, montant_total : réel Variables nom_client : chaîne de caractères
traduit en JS :
let taille_panier; let montant, tva, montant_tva, montant_total; let nom_client;
Comme en algo, la déclaration d'une variable n'est à faire qu'une fois.
Affectation
L'affectation est réalisé en utilisant le symbole =.
let taille_panier; taille_panier = 3;
Méthodes alert / écrire
La méthode alert() permet d'afficher vers l'utilisateur une information et correspondra à l'utilisation en algo de "écrire".
En algo :
écrire "ici un texte à afficher"
traduit en JS :
alert('ici un texte à afficher');
Exercice n°1
Réalisez les instructions suivantes :
- récupérez le fichier
- entre les balises script, insérez l'instruction ci-dessous
- ouvrez le fichier dans un navigateur
- vous devriez voir une petite fenêtre, cliquez sur OK pour la fermer
alert('bonjour');
Méthodes prompt / lire
La méthode prompt() permet de récupérer une information de l'utilisateur et correspondra donc à
"lire".
La particularité de prompt() est qu'il va permettre d'indiquer ce qui est attendu et donc faire ce
qui était fait avec un "écrire" précédent un "lire", le tout en une instruction.
En algo :
Variable chiffre : entier écrire "donner un chiffre entre 1 et 100" lire chiffre
traduit en JS :
let reponse; reponse = prompt("donner un chiffre entre 1 et 100");
La méthode prompt() ne peut récupérer qu'une seule valeur à la fois. Si vous avez besoin de lire plusieurs informations de l'utilisateur, il faudra pour chaque valeur définir l'instruction prompt().
Exercice n°2
Réalisez les instructions suivantes :
- récupérez le fichier
- entre les balises script, insérez l'instruction ci-dessous
- ouvrez le fichier dans un navigateur
- vous devriez voir une petite fenêtre, cliquez sur OK pour la fermer
let reponse; reponse = prompt('Bonjour ! Ecrivez votre prénom :'); alert(reponse);
Commentaires
Basé sur C/C++, il existe deux moyens de commenter qui sont :
- commentaire sur une seule ligne en précédent le contenu de //
- commentaire sur plusieurs en ligne en commençant par /* et en finissant par */
//déclaration de variable let prix_article, montant_total; let quantite; /* calcul du montant total obtenu en multipliant le prix par la quantité */ montant_total = prix_article * quantite;
Exercice n°3
Reprenez le code suivant et commentez là où c'est nécessaire :
ceci est un commentaire sur une ligne alert("Un texte à afficher"); ici encore un commentaire ceci est un commentaire sur plusieurs lignes ceci est la 2ème ligne du commentaire sur plusieurs lignes alert("Un autre texte à afficher"); encore un commentaire sur une ligne
Débugger
L'un des grands problèmes lorsque l'on écrit en JavaScript est la gestion des erreurs par ce langage. En effet, si une erreur survient, il arrive souvent que le script est tout simplement arrété sans afficher aucune information directement.
Pour accéder aux informations, il faut consulter la "console", un outil mis à disposition par les navigateurs pour aussi bien coder que débugger. Pour y accéder :
- sur Chrome
- Menu
- Plus d'outils
- Outils de développement (ou Ctrl + Maj + I pour ouvrir directement)
- un encart s'ouvre sur l'onglet "console"
- sur Firefox
- Menu
- Développement web
- Console web (ou Ctrl + Maj + K pour ouvrir directement)
- un encart s'ouvre sur l'onglet "console"
Exercice n°4
Débuggez
- dézippez et récupérez le fichier
- ouvrez le dans le navigateur
- accédez à la console et observez
- corrigez l'erreur dans le fichier (alert et non alet), enregistrez, rafraichissez la page
- consultez la console
Méthode console.log()
Autre méthode pour afficher un contenu, mais cette fois, plus à destination du développeur, la méthode console.log() permet d'afficher directement au niveau de la console ce qui est placé entre parenthèse.
//déclaration des variables let prenom; //instructions prenom = 'Antoine'; console.log(prenom); console.log('La console affiche ceci');
Exercice n°5
Dans une page html, entre balises script, en utilisant console.log() :
- ajoutez une instruction affichant "ici la console" dans la console
- ouvrez la console pour observer
- définissez une variable ville, contenant votre ville de naissance
- affichez le contenu de la variable au niveau de la console
Variable
Comme vu précédemment, la déclaration d'une variable se fait en utilisant le mot clef "let" suivi du nom de la variable qui doit respecter les règles suivantes :
- doit commencer par une lettre ou le caractère underscore ( _ )
- ne peut pas commencer par un chiffre
- doit contenir une ou plusieurs lettres, un ou plusieurs chiffres et/ou un ou plusieurs underscores
- ne doit contenir aucun espace
- est sensible à la casse (minuscule / majuscule) : nom_de_variable et NOM_de_variable sont 2 variables différenciées
- doit eviter de contenir des caractères accentués, source de problème avec l'encodage du fichier (étape -> etape)
Le nom d'une variable doit être défini de manière à aider à la compréhension des instructions / du programme : compteur, ville.
A noter que rien ne permet d'identifier une variable, aucun caractère (comme le $ en PHP), n'est ajouté lors de l'utilisation d'une variable.
Type de variable
Le contenu d'une variable (sa valeur) peut être de différents types :
- des types primitifs de données
- type booléen : bool en anglais, ne peut contenir que les valeurs "vrai" ou "faux" (true / false)
- type number : il comprend tous les types numériques, des entiers aux nombres à virgule
- type chaîne de caractères : string en anglais
- type undefined : mot clé qui correspond à la valeur d'une variable déclarée mais non initialisée
- type null : mot clé permettant de "vider" une variable
- un type pour les objets
- type object
Javascript est un langage faiblement typé, utilisant le typage dynamique.
Cela signifie que c'est le contenu de la variable qui va définir son type : si la variable contient une
chaîne de caractères, elle est de type chaîne de caractères ; si elle contient un entier, elle est de
type
numérique (number).
Néanmoins, s'agissant de la traduction d'un algorithme, le respect du type sera à maintenir en Javascript.
Chaîne de caractères
Le type chaîne de caractères se définit avec les simples ou les doubles quotes.
//déclaration des variables let ville; let code_postal; //instructions ville = 'Metz'; ville = "Metz"; code_postal = "57000";
Echappement de caractère
Si dans la chaîne de caractères figure le caractère utilisé pour définir la chaîne, il est possible de
l'échapper pour que celui-ci ne soit pas pris en compte par l'interpréteur Javascript.
Pour cela, il faut utiliser le caractère \ (altgr + 8) devant le caractère.
//déclaration des variables let citation, saison; //instructions citation = "Jules Verne : \"On peut braver les lois humaines, mais non résister aux lois naturelles.\""; saison = 'L\'automne est à nos portes';
Exercice n°6
Echappez correctement les deux phrases suivantes :
- Nous devons à Ann Landers cette phrase célèbre : "On n'a jamais autant besoin de vacances que lorsqu'on en revient."
- Robert Orben a déclaré : "Être en vacances, c'est n'avoir rien à faire et avoir toute la journée pour le faire."
- utilisez console.log() pour afficher le contenu des 2 phrases
- si vous avez utilisez les guillemets pour encadrer les chaines de caractères, remplacez par les simple quotes et échappez le bon caractère.
- utilisez console.log() pour affichez le contenu des 2 phrases
Concaténation
La concaténation est probablement l'instruction la plus courante portant sur les chaînes.
Il s'agit de "coller" 2 éléments de type chaîne (généralement) en utilisant le symbole "+"
(appelé alors opérateur de concaténation) entre les éléments.
//déclaration des variables let prix_panier_TTC; //instructions console.log("La ville de " + "Metz"); alert("Le prix TTC est de " + prix_panier_TTC);
L'opérateur de concaténation utilisant le symbole + comme l'opérateur d'addition, des bugs donnant des résultats surprenants peuvent survenir.
//déclaration des variables let sexe; let departement; let debut_num_sec_soc; //instructions debut_num_sec_soc = sexe + departement; //comme les opérandes sont de type number, ça fera la somme et non une concaténation
La solution ? Transformer au moins l'un des éléments en chaîne (attention au respect du typage) ou ajouter une chaîne vide au début de la concaténation :
debut_num_sec_soc = "" + sexe + departement; //concaténation
Ce problème ne survenant que dans le cas où uniquement des valeurs numériques sont utilisées, ça n'est pas nécessaire si la concaténation implique 1 ou plusieurs chaîne de caractères.
Exercice n°7
Réalisez les instructions suivantes :
- définissez les variables suivantes :
- une variable "prenom"
- une variable "ville"
- une variable "cp"
- affectez des valeurs à ces variables
- en utilisant console.log() pour l'affichage au niveau de la console :
- concatenez "bonjour" avec le contenu de la variable prenom
- concatenez les variables ville et cp
Opérateurs de comparaison
Comme en mathématique, il est possible de comparer des valeurs entre elles avec :
- x est strictement supérieur à y: x > y
- est supérieur ou égal : x >= y
- est strictement inférieur : x < y
- est inférieur ou égal : x <= y
- est égal à : x == y
- est différent de : x != y
Un test de comparaison entre des valeurs est constitué de 2 opérandes et d'un opérateur uniquement.
Il n'est pas possible d'écrire 10 <= x < 100 directement.
Un tel test s'écrit en utilisant deux parties : (x >= 10) && (x < 100)
Une erreur courante consiste à confondre l'affectation (=) et la comparaison d'égalité (==).
let est_complet; est_complet = false; //affectation console.log(est_complet = true); //écrira true alors que false est attendu !
L'affectation réussissant la valeur "true" est renvoyé. Pour comparer, il faut donc faire attention de ne pas oublier de symbole =.
let est_complet; est_complet = false; //affectation console.log(est_complet == true); //écrira false (réponse attendue)
Exercice n°8
Réalisez les instructions suivantes :
- définissez deux variables valeur_1 et valeur_2
- affectez une valeur numérique différente à chacune des variables
- affichez au niveau de la console (console.log()) la comparaison des deux variables
- affectez à valeur_1 le contenu de valeur_2
- affichez au niveau de la console (console.log()) la comparaison des deux variables
Exercice global
Dans cet exercice, vous allez reprendre tout ce qui a été vu.
Exercice n°9
Réalisez les instructions suivantes :
- définissez les variables suivantes :
- prenom
- nom
- age
- en utilisant prompt() pour chacune des variables, demandez à l'utilisateur d'affecter des valeurs à ces variables.
- affichez au niveau de la console (console.log()) la valeur affecté à age
- concatenez prenom et nom et affichez le résultat en utilisant la méthode alert()
- affichez le résultat de la concaténation également au niveau de la console (console.log())
Conditionnel
Les tests conditionnels permettent de changer le comportement d'un programme en fonction de variables, d'événements, d'action ou de choix de l'utilisateur. Cela permet d'apporter une variation à une réponse par exemple.
si ma condition est vraie alors j'applique une ou plusieurs instructions sinon j'applique une ou plusieurs autres instructions finsi
Pour traduire cela en Javascript, il faut utiliser les mots clés if et else :
if (condition) { //accolade ouvrante instruction(s); } else { instruction(s); } //accolade fermante
Les accolades délimitent ce qu'on appelle un bloc. Dans l'exemple précédent, il y a donc 2 blocs : l'un pour le cas où la condition est vraie, et l'autre dans le cas contraire.
Exercice n°10
Réalisez les instructions suivantes :
Exo A :
- a l'aide de la méthode prompt() récupérez le genre de la personne
- si c'est une femme, affichez avec alert(), "Bonjour madame"
- sinon "Bonjour monsieur"
Exo B :
- récupérez l'année de naissance de l'utilisateur
- déterminez son âge (on ne tiendra compte que de l'année)
- s'il a plus de 18 ans, affichez qu'il peut regarder la bande annonce d'un jeu d'horreur
- sinon affichez qu'il est trop jeune pour accèder à la bande d'annonce
Imbrication
Si plusieurs cas de figure sont à prendre en compte, il est possible de faire un test propre pour chacun des cas. Néanmoins, si le test concerne un même élément, le plus simple est d'imbriquer les tests.
if (lettre == 'a') { alert("Vous avez tapé la lettre 'a'); } if (lettre == 'b') { alert("Vous avez tapé la lettre 'b'); } //etc...
Avec l'exemple ci-dessus, si la lettre tapée est 'a', la comparaison avec la lettre 'b' est réalisée. En imaginant qu'il y ait ainsi les 26 lettres de l'alphabet, il y aurait 26 tests de réalisé.
if (lettre == 'a') { alert("Vous avez tapé la lettre 'a'); } else { if (lettre == 'b') { alert("Vous avez tapé la lettre 'b'); } else { if (lettre == 'b') { alert("Vous avez tapé la lettre 'b'); } } } //etc...
Avec l'exemple ci-dessus, si la lettre tapée est 'a', un seul test est réalisé.
Ce genre de structure est une imbrication de tests conditionnels : un ou plusieurs tests contenus dans le bloc d'un autre test.
En utilisant "else if", il est possible de limiter le nombre de bloc à créer (nombre d'accolade) :
if (lettre == 'a') { alert("Vous avez tapé la lettre 'a'); } else if (lettre == 'b') { alert("Vous avez tapé la lettre 'b'); } else if (lettre == 'c') { alert("Vous avez tapé la lettre 'c'); } //etc...
Contrairement à PHP, "sinon si" en Javascript s'écrit avec les deux mots clés détachés.
Exercice n°11
L'utilisateur inscrit un chiffre entre 1 et 10 :
Exo A :
En utilisant les tests conditionnels, indiquez si le chiffre est :
- inférieur ou égal à 3
- compris entre 4 et 7 compris
- supérieur ou égal à 8
Exo B :
En utilisant les tests conditionnels et l'opérateur modulo, indiquez :
- (un seul des deux cas à afficher : 6 -> multiple de 2)
- si le chiffre est un multiple de 2
- si le chiffre est un multiple de 3
Exo C :
Que faudrait-il modifier afin que pour 6, soit affichées les deux lignes (multiple de 2 et de 3) ?
Conditions liées et opérateurs booléens
Si la condition est une condition composée (constituée de plusieurs tests), il faut liés les tests en utilisant les opérateurs booléens :
- ET sera remplacé par l'opérateur &&
- OU par ||
- NON par !
if (nombre_utilisateur % 2 == 0 && nombre_utilisateur % 3 == 0) { alert('Le nombre donné est un multiple de 2 et de 3'); } if (nombre_utilisateur % 2 == 0 || nombre_utilisateur % 3 == 0) { alert('Le nombre donné est un multiple de 2 ou de 3'); } if (!(temperature < 0)) { alert('Il ne gèle pas'); }
Exercice n°12
En charge du calcul des frais de port, vous devez prendre en compte les critères suivants :
- si montant_commande est supérieur à 100 euros, c'est offert
- si montant_commande est inférieur à 25 euros, ça sera 6 euros
- si montant_commande est compris entre à 25 et 50 euros, ça sera 4 euros
- si montant_commande est compris entre à 50 et 100 euros, ça sera 2 euros
La méthode prompt() retournant une valeur de type chaîne de caractère pour éviter que
le + pour les additions ne soit compris comme opérateur de concaténation, utilisez
parseFloat().
La méthode parseFloat() transforme une valeur en type chaîne de caractère en valeur de type
décimale.
let valeur = "12"; //chaine de caractère let valeur_decimale = parseFloat(valeur);
Simplification d'écriture
La condition dans un test est une instruction qui renvoie un valeur de type booléenne.
Si
l'utilisateur recherche un mot et que le mot est trouvé,
let est_mot_correct;
//... code permettant de définir le mot à trouver et de récupérer le mot donné par l'utilisateur
//... modification du contenu de la variable est_mot_correct
if (est_mot_correct == true) {
alert('Vous avez trouvé le mot !');
}
Le test peut être modifié ainsi :
if (est_mot_correct) { alert('Vous avez trouvé le mot !'); }
Pour réagir à un cas contraire, on utilise l'opérateur ! qui inverse une valeur :
if (!est_mot_correct) {
alert('Vous n\'avez pas trouvé le mot !');
}
Exercice n°13
Réalisez les instructions suivantes :
- simplifiez le code ci-dessous
- vous devez uniquement
- soit retirer du code
- soit ajouter le caractère "!"
if (depart_demain == true) { if (reservation_hotel_non_prise == true) { alert('Reservez votre hôtel !'); } if (valise_prete == false) { alert('Vous devez faire votre valise'); } else { if (billet_imprime == true) { alert('Vous êtes prêt pour votre départ demain'); } } }
De la même manière, en Javascript, 1 est équivalent à true et 0 à false.
if ( ! (1-1) ) { alert('ok'); }
Exercice n°14
Réalisez les instructions suivantes :
- simplifiez le code ci-dessous
- vous devez uniquement
- soit retirer du code
- soit ajouter le caractère "!"
if (nombre_utilisateur % 3 == 0) { alert('Le nombre donné est un multiple de 3'); } if (nombre_utilisateur % 2 == 1) { alert('Vous avez insrit un nombre impair'); }
Il n'y a pas que 1 qui soit équivalent à vrai mais 242 ou -1 ou -242 ou une chaîne de caractères non vide
Traduction d'un algorithme
En utilisant ce qui a été vu jusqu'à présent, traduisez les algo suivants :
Exercice n°15
Traduisez en Javascript et testez :
Variable temp : entier Variables est_glace, est_vapeur : booléen Début écrire "Entrez la température de l’eau :" lire temp est_glace temp <= 0 est_vapeur temp < 100 Si est_glace Alors écrire "C’est de la glace" SinonSi est_vapeur Alors écrire "C’est du liquide" Sinon écrire "C’est de la vapeur" Finsi Fin
Exercice n°16
Traduisez en Javascript (exercice algo.10b) et testez :
Variable heure, minute : entier Début écrire "Donnez l'heure qu'il est : " lire heure écrire "Donnez les minutes : " lire minute SI minute = 59 ALORS SI heure = 23 ALORS heure <- 0 SINON heure <- heure + 1 FINSI minute <- 0 SINON minute <- minute + 1 FINSI écrire "Dans une minute, il sera " & heure & " heure(s) " & minute & "." Fin
La méthode prompt() retournant une valeur de type chaîne de caractère pour éviter que
le + pour les additions ne soit compris comme opérateur de concaténation, utilisez
parseFloat().
La méthode parseFloat() transforme une valeur en type chaîne de caractère en valeur de type
décimale.
let valeur = "12"; //chaine de caractère let valeur_decimale = parseFloat(valeur);
Exercice n°17
Traduisez en Javascript (exercice algo.10c) et testez :
Variable année : entier est_bissextile : booléen Début écrire "Indiquez une année : " lire année SI (année modulo 400 = 0 OU (année modulo 4 = 0 ET NON(année modulo 100 = 0)) ALORS écrire année & "est une année bissextile." SINON écrire année & "n'est pas une année bissextile." FINSI Fin
Exercice n°18
Traduisez en Javascript (exercice algo.11b) et testez :
Programme Assurance Variable cotisation : réel Variable genre : caractère Variable age, incident, annee_permis : entier DEBUT cotisation <- 500 écrire "incidents durant les 3 dernières années ?" lire incident SI incident >= 3 ALORS écrire "Assurance impossible" SINON //assurance possible écrire "l'âge de l'assuré ?" lire age écrire "le genre de l'assuré (h/f) ?" lire genre écrire "permis depuis combien d'année ?" lire annee_permis SI age <= 25 ALORS cotisation <- cotisation + 80 SI genre = 'h' ALORS cotisation <- cotisation + 15 SINON cotisation <- cotisation + 5 FINSI SINON SI genre = 'f' ALORS cotisation <- cotisation - 10 FINSI FINSI SI annee_permis >= 4 ALORS cotisation <- cotisation - (annee_permis - 4) * 10 FINSI SI incident > 0 ALORS cotisation <- cotisation + (incident * 30) FINSI FINSI FIN
Boucle conditionnelle
Si une ou plusieurs instructions doivent être exécutées de manière répétée tant qu'une condition est
vraie, les boucles conditionnelles sont l'outil idéal.
En Javascript, on parle de boucle while :
while (condition_valide) { instructions itératives }
Un cas d'exemple est le suivant :
let est_renseigne = false; let texte; //tant que l'utilisateur n'a rien inscrit, on continue de demander while (!est_renseigne) { texte = prompt("Votre nom ?"); if (texte != '') est_renseigne = true; }
Boucle do..while
Variante de la boucle while, la boucle do..while vérifie le respect de la condition une fois sorti du bloc d'instructions et non avant comme dans une boucle while.
let est_renseigne = false; let texte; do { texte = prompt("Votre nom ?"); if (texte != '') est_renseigne = true; } while (!est_renseigne);
Exercice n°19
Exo A :
Réalisez les instructions suivantes :
- demandez à l'utilisateur de renseigner l'année en cours (avec prompt())
- tant qu'il n'inscrit pas l'année correcte, il reste dans la boucle
- affichez avec alert() l'année renseignée à la sortie de la boucle
Exo B :
Réalisez les instructions suivantes :
- demandez à l'utilisateur un mot avant la boucle
- à l'intérieur de la boucle, demandez lui de donner le nombre exact de lettre du mot donné
- (le nombre de caractère peut être déterminé en utilisant la propriété length
let mot; mot = 'javascript'; console.log( mot.length );
Tableaux
Les tableaux sont des structures qui permettent d’organiser des variables de même type (normalement) et sous un même thème : on parle d’ensemble de variable. L’intérêt est que l’ensemble des variables est centralisé sous un nom, rendant ainsi la manipulation d'un jeu de données plus simple.
Pour déclarer un tableau vide :
let jours; jours = [];
Pour déclarer et pré-remplir un tableau :
let jours; jours = ["lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi", "dimanche"];
Contrairement à l'algorithme, on ne définit pas la taille du tableau : cela est géré dynamiquement.
Le premier indice d'un tableau est 0
Pour accéder à un indice du tableau, il faut utiliser la position de l'indice :
console.log(jours[0]); //inscrira "lundi" dans la console
Pour connaître la taille d'un tableau, il faut utiliser la propriété length :
console.log( jours.length );
Exercice n°20
Réalisez les instructions suivantes :
- Déclarez un tableau devant contenir des chiffres
- Remplissez les 5 premiers positions du tableau avec des chiffres
- Déclarez un tableau devant contenir des lettres et pré-remplissez le avec les voyelles
- Affichez au niveau de la console la taille des deux tableaux
Tableaux et boucles conditionnelles
Pour afficher le contenu d'un tableau, une boucle conditionnelle peut être utilisée. La condition
de poursuite est que l'on ait pas atteint la fin du tableau.
En plus du tableau lui-même, il nous faut définir :
- définir une variable qui va servir de repère dans l'index en cours de passage que l'on va nommer index
- définir une variable contenant la taille du tableau, nommée simplement taille qui aidera à déterminer la limite
- ne pas oublier d'augmenter compteur sous peine d'être coincé dans la boucle (boucle infinie)
let jours; jours = ["lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi", "dimanche"]; let taille; let index = 0; taille = jours.length; while (index < taille) { console.log( jours[index] ); index = index + 1; }
Exercice n°21
Réalisez les instructions suivantes :
- définissez un tableau mot
- demandez à l'utilisateur 5 mots que vous conserverez dans le tableau
- une fois récupérez tous les mots, affichez les dans la console
Remarque : vous aurez besoin de deux boucles, une première pour récupérer les mots et une seconde pour les afficher.
Boucle itérative
Si une ou plusieurs instructions doivent être exécutées de manière répétée un nombre
prédéterminé de fois, la boucle For est l'outil idéal.
La boucle for peut être comparé à un
ascenseur direct : imaginons qu'à partir du 1er étage, on souhaite aller jusqu'au 6ème, forcément,
l'ascenseur passera devant les autres étages (qu'il s'y arrête ou pas). En connaissant l'étage de
départ et celui de l'arrivée, il est facile de déterminer le nombre d'étage parcouru.
La construction de la boucle For est consituée de 3 parties qui sont :
for (initialisation_compteur; condition_de_poursuite; pas_du_compteur)
- initialisation_compteur permet d'indiquer la valeur de départ du compteur
- condition_de_poursuite permet d'indiquer la condition à respecter pour que la boucle se poursuive
- pas_du_compteur indique à quelle vitesse le compteur grandit (ou diminue)
Par exemple :
for (let i = 0; i < 10; i++) { console.log('passage n° ' + i + ' dans la boucle'); }
Exercice n°22
Réalisez les instructions suivantes :
- faites une boucle affichant les chiffres de 0 jusque 9
- faites une boucle affichant les chiffres de 9 jusque 0
- demandez à l'utilisateur :
- une valeur de départ
- une valeur d'arrivée
- faite une boucle qui allant de l'un à l'autre en affichant la valeur du passage
Boucles itératives et tableaux
Du fait de la présence d'un compteur dans la boucle For et d'un index dans le tableau, les deux ayant un comportement similaire (type entier, grandissant généralement d'un cran), la boucle For se trouve être l'outil idéal pour parcourir le contenu d'un tableau.
let jours; jours = ["lundi", "mardi", "mercredi", "jeudi", "vendredi", "samedi", "dimanche"]; let taille; taille = jours.length; for (let compteur = 0; compteur < taille; compteur++) { console.log( jours[compteur] ); }
Exercice n°23
Réalisez les instructions suivantes :
- comme pour l'exercice avec les boucles conditionnelle, définissez un tableau mot
- demandez à l'utilisateur 5 mots que vous conserverez dans le tableau
- une fois récupérez tous les mots, affichez les dans la console
Traduction d'algorithmes
En utilisant tout ce qui a été vu jusqu'à présent, traduisez ces algorithmes en Javascript :
Exercice n°24
Traduisez en Javascript (exercice algo.19) et testez :
tableau t(10) : entier variable v, i, j : entier Debut pour i de 0 à 9 par 1 lire t[i] finpour lire v j <- 0 pour i de 0 à 9 par 1 si t[i] = v alors j <- j + 1 finsi finpour ecrire j Fin
Testez avec les valeurs suivantes :
- 2 6 5 8 2 3 5 4 2 3
- 2
Exercice n°25
Traduisez en Javascript (exercice algo.20) et testez :
tableau t(10) : entier variable v, i : entier variable j : booléen Debut pour i de 0 à 9 par 1 lire t[i] finpour lire v j <- faux i <- 0 tantque j = faux ET i <= 9 faire si t[i] = v alors j <- vrai finsi i <- i + 1 fintantque si j = vrai alors ecrire 1 sinon ecrire 0 finsi Fin
Testez avec les valeurs suivantes :
- 5 3 6 8 4 1 2 7 6 9
- 7
Exercice n°26
Traduisez en Javascript (exercice algo.21) et testez :
tableau t(10) : entier variable v, i, c : entier Debut pour i de 0 à 9 par 1 v <- 0 tantque v <= 0 OU v > 100 faire lire v fintantque t[i] <- v finpour c <- 0 pour i de 0 à 9 par 1 si t[i] < 50 alors c <- c + 1 finsi finpour ecrire c Fin
Testez avec les valeurs suivantes :
- 52 35 65 202 84 48 19 252 0 125 22 72 64 9