Outils pour utilisateurs

Outils du site


p5.js:les_conditions_dans_p5js

Les conditions


Les structures conditionnelles permettent de tester si une expression est vraie (true) ou fausse (false) et d'exécuter des instructions différentes selon le résultat.

Organigramme

L'instruction if

La syntaxe de cette structure est la suivante :

if (condition) {
		// instructions exécutées quand la condition est vraie
}

On peut traduire cette instruction par : “Si la condition est vraie, alors exécute les instructions contenues entre les accolades”.

Opérateur Signification
== Egal à
!= Diffrérent de
> Supérieur à
>= Supérieur ou égal à
< Inférieur à
Inférieur ou égal à

Une condition est une expression dont l'évaluation produit une valeur soit vraie (true), soit fausse (false) : on parle de valeur booléenne.

On peut créer des expressions booléennes en utilisant les opérateurs de comparaison regroupés dans le tableau ci-contre :

Ne pas confondre le signe “=” avec “==” .
=” permet d'affecter une valeur à une variable. Exemple : nombreDeVie = 5.
==” permet de tester si deux valeurs sont égales et il renvoie un booléen true/false comme résultat.

Exemple :

function setup() {
 createCanvas(400, 400);
 strokeWeight(8);
}
function draw() {
    if (mouseIsPressed == true){
       line(mouseX, mouseY, pmouseX, pmouseY);
    }
}



A faire vous-même 1 projet6-1

Analyser et tester le sketch ci-dessus.



L'instruction else

Organigramme

L'instruction if peut être complétée par l'instruction else pour exprimer une alternative. Voici sa syntaxe.

if (condition) {
		// instructions exécutées quand la condition est vraie
}
else {
		// instructions exécutées quand la condition est fausse
}

On peut traduire une instruction if/else comme ceci : “Si la condition est vraie, alors exécute les instructions du bloc de code associé au if, sinon exécute celles du bloc de code associé au else”.

A faire vous-même 2

Modifier le sketch précédente pour que si le bouton de la souris est enfoncé et qu'une touche du clavier est aussi enfoncée (keyIsPressed == true) alors le trait est noir (stroke(0)) sinon le trait est blanc (stroke(255)) c.a.d on gomme le dessin.

A faire vous-même 3 projet6-3

Ecrire un sketch permettant de déplacer un cercle de gauche à droite du canvas.

A faire vous-même 4

Modifier le sketch précédent afin que le cercle fasse des allers-retours entre les bords verticaux du canvas.

p5.js/les_conditions_dans_p5js.txt · Dernière modification: 11/07/2019 21:30 par Stéphane LAURENT