Programación con funciones, clases y arreglos para artistas

Retorno de valores

Para acabar el tema de las funciones vamos a ver otra de sus características, ya que éstas no sólo pueden recibir información, también pueden devolverla y esta funcionalidad se conoce como retorno de valores.

Vamos a hacer un ejemplo para que veáis la utilidad porque se trata de un concepto muy simple.

¿Recordáis la operación módulo? La utilizamos para dibujar el tablero de ajedrez, concretamente para identificar si un número era par o impar. Pues vamos a crearnos una función que haga precisamente eso.

17 - Retorno/sketch.js

function setup() {
  createCanvas(400, 400);
  for(var i=0;i<10;i++) {
    esPar(i)
  }
}

function draw() {
  background(220)
}

function esPar(numero) {
  if (numero % 2 == 0) {
    print(numero, "es par")
  } else {
    print(numero, "es impar")
  }
}

Muy bien, nuestra función recibe un número, hace un cálculo y nos muestra un mensaje por pantalla. Pero... ¿Y si en lugar de mostrar un mensaje quisiéramos utilizarla para colorear las filas pares de una tabla? Está claro que con mostrar un mensaje no es suficiente, necesitamos algo más y eso es que la función se comunique con el exterior para decirnos si el número es par o no.

Para lograrlo utilizaremos el retorno de valores y podemos hacerlo de una forma muy sencilla, devolviendo true si el número es par y false si es impar:

function esPar(numero) {
  if (numero % 2 == 0) {
    return true
  } else {
    return false
  }
}

Esto se puede simplificar en dos líneas ya que como hemos dicho return no sólo devuelve un valor sino que también finaliza la función, haciendo imposible que se ejecute más de un return en la misma función:

function esPar(numero) {
  if (numero % 2 == 0) return true
  return false
}

La instrucción return nos permite finalizar una función y devolver un valor al exterior. Ese valor podemos almacenarlo en una variable o utilizarlo directamente:

function setup() {
  createCanvas(400, 400);
  for(var i=0;i<10;i++) {
    var resultado = esPar(i)
    if (resultado) print(i, "es par")
    else print(i, "es impar")
  }
}

Ahora que sabemos cómo almacenar los datos que devuelve una función ya podemos dibujar nuestra tabla con las filas pares coloreadas:

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

function draw() {
  background(220)
  var filas = 25;
  for(var i=0;i<filas;i++) {
    fila(0, i*(height/filas), width, height/filas, esPar(i))
  }
}

function esPar(numero ) {
  if (numero % 2 == 0) return true
  return false
}

function fila(x, y, anchura, altura, esPar){
  if (esPar) fill(150) 
  else noFill()
  rect(x, y, anchura, altura)
}

¿Qué os ha parecido este ejemplo? Ahora ya sabéis como lo hacen para colorear las filas de las tablas automáticamente.