Declarando e inicializando variables

Para almacenar valores en memoria los lenguajes de programación usan variables.

Una variable se define usando la palabra reservada var de la siguiente manera:

var [Nombre de la variable] = [Valor inicial de la variable]; 

El siguiente ejemplo muestra la definición de la variable pos para almacenar la posición, y la inicialización de la variable con un valor de 300.

var pos = 300;

Una vez la variable es definida ya se puede utilizar en las instrucciones del programa sin utilizar la palabra reservada var. Por ejemplo, las siguientes instrucciones le suman 1 al valor de la variable, lo almacenan nuevamente en la misma variable y muestran el valor de la variable sumado con 10 en una caja de alerta. Intente oprimir el botón de ejecutar varias veces.

pos = pos + 1;
alert(pos + 10);

Valor de la variable pos: 300

Ejecutar

Alcance de las variables

El alcance de una variable es el conjunto de lugares en un programa desde donde se puede acceder al valor de una variable:

• Hay variables que tienen alcance global, es decir se pueden llamar desde cualquier lugar, si son declaradas por fuera de las funciones.
• Hay también variables de alcance local, es decir que solo se pueden llamar desde la función donde fueron declaradas.

Por ejemplo, en el programa abajo se muestra una variable ancho de alcance global y dos variables x y y de alcance local:

var ancho= 300;
function setup() {
    createCanvas(ancho * 2, 400);
}

function draw() {
    var x = 300;
    var y = 400;
    ellipse(x, y, 100, 100);
}

Ejemplo

Este ejemplo muestra cómo mover una figura, usando variables.

Intenta realizar lo siguiente en el programa a continuación:

• Explique qué hace el ejemplo.
• Incluir una variable global para simular la velocidad, por ejemplo, var velocidad = 4;
• Cambiar la función para que use la variable velocidad para mover los círculos.
• Incluir variables para simular de manera separada la velocidad en el eje x y la velocidad en el eje y.
• Mover las figuras de acuerdo a las velocidades de x y de y.
• Incluir otra figura que se mueva también.

Recuerda: siempre puedes restaurar el programa original oprimiendo el botón Restaurar.