Control de flujo, condiciones y bucles para artistas

Condición if-else

Ahora que sabemos cómo se evalúan las expresiones lógicas ya podemos crear nuestras propias condiciones, para ello se utiliza esta sintaxis:

if (true) {
  // Bloque que se ejecutará
}

Si (if)

En español if significa si y podemos leerlo como "si se cumple la condición ejecutar el bloque de código". Además donde tenemos true podemos poner cualquier expresión lógica cuyo resultado sea verdadero. Vamos a hacer un ejemplo:

11 - Condicion si/sketch.js

var dibujar = true;

function setup() {
  createCanvas(400, 400)
}

function draw() {
  background(220)
  if (dibujar == true) {
    fill(220, 0, 0)
    ellipse(200, 200, 50, 50)
  }
}

Como véis podemos controlar si dibujamos o no el círculo con la variable dibujar y algo muy interesante que podríamos hacer es activar o desactivar la condición definiendo un evento de clic:

function mousePressed(){
  dibujar = !dibujar;
}

El operador lógico ! sirve para negar una expresión lógica, devolviendo verdadero si ésta es falsa o falso si es verdadera.

Si no (else)

Lo que hemos hecho también se puede programar con una contracondición else, que se añade siempre después de un if para comprobar el caso contrario. En conjunto se leería "si se cumple la condición ejecutar el bloque de código, si no se cumple ejecutar el otro bloque de código":

function mousePressed(){
  if (dibujar) {
  	dibujar = false
  } else {
  	dibujar = true
  }
}