Hola Gustavo, cuando llamas a la función y ésta va como parámetro no se coloca paréntesis. y en el caso de limpiarPantalla funciona porque la función no actúa como parámetro.
Imaginate que es una figura y necesitas poner colores:
dibujarCuadrado(x,y,"green");
dibujarCuadrado(x,y,"red");
dibujarCuadrado(x,y,"blue");
En esa función de dibujarCuadrado(dentro de los paréntesis pusiste los valores del elemento).
Ahora si yo hubiera creado un array var colores= ["green", "blue", "red"] , tambien creo una variable que me indique el indice del array var indiceColorActual = 0.
Luego creo una función que vaya haciendo el recorrido de ese array para ir eligiendo los colores dentro de ese array y la llamo elegirColor(){ aqui va el condicional y el incremento que haga que recorra el array. Seria indiceColorActual ++}
Cuando llamo a la función:
dibujarCuadrado(x,y,elegirColor); // Para que se entienda a modo de ejemplo digamos que la función "elegirColor" está funcionando como parámetro y por eso no lleva paréntesis. En caso anterior vos elegias que color va en cada cuadrado y en este caso lo automatizaste.
Acordate de este ejercicio
var pantalla = document.querySelector("canvas");
var pincel = pantalla.getContext("2d"); pincel.fillStyle = "grey";
pincel.fillRect(0,0,600,400);
var color = ["blue","green","yellow", "red","pink"];
var indiceColorActual = 0;
function dibujarCirculo(evento){
var x = evento.pageX - pantalla.offsetLeft;
var y = evento.pageY - pantalla.offsetTop;
pincel.fillStyle = color[indiceColorActual];
pincel.beginPath();
pincel.arc(x,y,10,0,2*3.14);
pincel.fill();
console.log(x + "," + y);
}
pantalla.onclick = dibujarCirculo;
function alterarColor() {
indiceColorActual++;
if(indiceColorActual >= color.length) {
indiceColorActual =0;
}
return false;
}
pantalla.oncontextmenu = alterarColor;
