meta données pour cette page
  •  

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Prochaine révision		Révision précédente
boucles [2016/09/18 17:45] – créée Alexandre Castonguayboucles [2016/09/18 22:25] (Version actuelle) – Alexandre Castonguay
Ligne 1: Ligne 1:
-Copié avec quelques adaptations de : https://fr.flossmanuals.net/processing/les-repetitions/+====Les boucles====
  
-**Les boucles**+Les boucles permettent d'exécuter une série d'instructions plusieurs fois de suite. Elles évitent de dupliquer inutilement des portions de code. Lorsque l'ordinateur lit le programme et rencontre une boucle, il va exécuter le code écrit dans le bloc de la boucle qu'on lui a indiqué. Il le fait instantanément et autant de fois de suite tant que sa condition est vraie.
  
-Les boucles permettent d'exécuter une série d'instructions plusieurs fois de suite. Elles évitent de dupliquer inutilement des portions de code. Lorsque l'ordinateur lit le programme et rencontre une boucle, il va exécuter instantanément autant de fois de suite le code écrit dans le bloc de la boucle qu'on lui a indiqué.+**La boucle for**
  
-L'exemple ci-dessous va nous permettre d'illustrer simplement cette notion. L'objectif est de réaliser un dessin affichant dix lignes horizontales. +Ce type de boucle permet de répéter une série d'instructions un nombre de fois défini. Elle incorpore une variable qui va s'incrémenter après chaque passage dans la boucle. On utilise souvent 'i' comme nom pour la variable interne de la boucle. Elle comprend : un nombre de départ, un nombre maximal et une incrémentation. Sa syntaxe est la suivante : for (i = NombreDeDépart; i < NombreMaximal; i = i + INCREMENT) { }.   
 + 
  
-<shx js>+L'exemple ci-dessous va nous permettre d'illustrer simplement cette notion. L'objectif est de réaliser un dessin affichant dix lignes horizontales. Nous pouvons écrire les 10 lignes 
 + 
 +<sxh js>
 function setup() { function setup() {
-createCanvas(625, 500);  // crée un canvas de 600 par 500 pixels+createCanvas(625, 500);  // crée un canevas de 625 par 500 pixels
 } }
  
Ligne 24: Ligne 27:
     line(50, 400, 550, 400);     line(50, 400, 550, 400);
     line(50, 450, 550, 450);     line(50, 450, 550, 450);
 +    line(50, 500, 550, 500);
          
 } }
-</shx js> +</sxh> 
  
  
 +Mais il est plus rapide d'utiliser la boucle 'for' afin d'exécuter 10 fois l'instruction line() :
 +
 +<sxh js>
 +function setup() {
 +createCanvas(625, 500); 
 +}
 +
 +function draw() {
 +    background(0); 
 +    stroke(255,200,255); 
 +   
 +    for(i=0;i<10;i++){ 
 +        line(50, i*50, 550, i*50);  // dessine une ligne à chaque fois que la boucle est appelée. Ici 'i' va changer de valeur.       
 +        }  
 +}
 +
 +</sxh>
  
 Le premier code contient dix fois l'instruction line(), le second code est réalisé à partir d'une boucle. Le résultat des deux codes est le même, la différence se situant au niveau de la longueur du code, l'un étant plus rapide à saisir (et ultérieurement à modifier) que l'autre. Le premier code contient dix fois l'instruction line(), le second code est réalisé à partir d'une boucle. Le résultat des deux codes est le même, la différence se situant au niveau de la longueur du code, l'un étant plus rapide à saisir (et ultérieurement à modifier) que l'autre.
 +
 +Exemple : afficher des carrés disposés en ligne et colonnes.
 +
 +<sxh js>
 +
 +function setup() {
 +createCanvas(625, 500); 
 +}
 +
 +function draw() {
 +    background(0);
 +    translate(70,15);  // déplace l'espace de dessin
 +    noFill(); // évite de remplir les rectangles
 +    stroke(255,200,255); 
 +    for(i=0;i<10;i++){    // première boucle
 +        for(j=0;j<10;j++){  // seconde boucle    
 +           rect(i * 50, j*50, 20, 20);   // appel de la fonction rect()   
 +        }  // fin de la première boucle            
 +    }  // fin de la seconde boucle 
 +}
 +</sxh>
 +
 +Copié avec quelques adaptations depuis : https://fr.flossmanuals.net/processing/les-repetitions/