xxxxxxxxxx
70
function setup() {
createCanvas(400, 400);
// Maintenant que nous avons vu des expressions logiques, il est temps de s'en servir !
// La construction `if(<expr>) { <b1> } else { <b2> }` est une expression conditionnelle
// Le bloc b1 est exécuté si le résultat de <expr> est `true`
// et le bloc b2 est exécuté sinon
if(true) {
console.log("C'est vrai");
} else {
console.log("C'est faux");
}
// Il existe aussi une variante `if(<expr>) { <b> }`
// ou aucun bloc n'est exécuté si la condition est fausse
if(0 > 2) {
console.log("Il se passe des choses !");
}
// De plus, les `if` peuvent être chainés avec des `else if`
// Dans ce cas, le premier bloc dont la condition est vrai
// sera exécuté, mais pas les suivants
if(1 == 0) {
console.log(1); // Pas exécuté
} else if(2 < 3) {
console.log(2); // Exécuté
} else if(4 >= 4) {
console.log(3); // Pas exécuté
}
// Enfin, les `if` peuvent bien sûr être imbriqués
if(7 + 3 == 10) { // Vrai
if(2 > 4) { // Faux
console.log("Premier");
} else {
console.log("Deuxième");
}
} else {
if(5 + 4 >= 4) { // Vrai
console.log("Troisième");
} else {
console.log("Quatrième");
}
}
}
function draw() {
// Couleurs du fond
noStroke();
fill('red'); rect(0,0,200,200);
fill('yellow'); rect(200, 0, 200, 200);
fill('green'); rect(200,200,200,200);
fill('blue'); rect(0, 200, 200, 200);
{ // A FAIRE faire en sorte que le carré central soit de la couleur de la zone
// où se trouve le curseur de la souris
// devient vert. INDICE: utiliser fill('blue'), fill('yellow'), ...
// POUR PLUS DE DEFI essayez d'écrire les conditions avec le moins d'opérateurs
// de comparaisons possibles (4 sont suffisants)
let x = mouseX; // Position horizontal du curseur
let y = mouseY; // Position verticale du curseur
stroke('black'); fill('black');
// AJOUTER des conditions ici
rect(150, 150, 100, 100);
}
}