{"id":822,"date":"2019-08-19T11:07:40","date_gmt":"2019-08-19T09:07:40","guid":{"rendered":"http:\/\/quadern-tpi.recursos.uoc.edu\/2-5-2-variables\/"},"modified":"2019-10-15T12:58:09","modified_gmt":"2019-10-15T10:58:09","slug":"2-5-2-variables","status":"publish","type":"page","link":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/2-5-2-variables\/","title":{"rendered":"2.5.2. Variables"},"content":{"rendered":"<p>En programaci\u00f3n se usan variables para ir guardando los datos que necesitamos. Son como cajones donde podemos guardar n\u00fameros o cadenas de caracteres. Podemos acceder a ellos cuando queramos, comprobar su contenido y\/o cambiarlo.<\/p>\n<p>Con Snap! es muy f\u00e1cil crear variables y utilizarlas. Estos son los bloques que podemos usar para gestionarlas.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-1338\" src=\"\/wp-content\/uploads\/2019\/10\/20.212_48_cast.png\" alt=\"\" width=\"299\" height=\"222\" \/><\/p>\n<p>Haciendo clic en \u00abCrea una variable\u00bb, podemos crear una nueva, a la que deberemos darle un nombre, y decidir si ser\u00e1 accesible solo desde el personaje donde lo estamos creando o tambi\u00e9n desde todos (en general, para programas no muy complejos, la opci\u00f3n accesible desde todos ser\u00e1 la m\u00e1s c\u00f3moda).<\/p>\n<p>Una vez creada, la nueva variable nos aparecer\u00e1 en este mismo men\u00fa y ya la podremos usar.<\/p>\n<p>Veremos c\u00f3mo se utilizan con un ejemplo muy sencillo. Es un proyecto donde hay dos personajes: una bola rosa y una azul. Estas bolas se mueven todo el rato por el escenario, y cada una tiene asociada una variable que va contando el n\u00famero de veces que hemos hecho clic encima con el rat\u00f3n. Adem\u00e1s, hay una tercera variable que muestra todo el rato la suma de las otras dos variables.<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-1340 size-full\" src=\"\/wp-content\/uploads\/2019\/10\/20.212_49_cast.png\" alt=\"\" width=\"480\" height=\"360\" srcset=\"\/wp-content\/uploads\/2019\/10\/20.212_49_cast.png 480w, \/wp-content\/uploads\/2019\/10\/20.212_49_cast-300x225.png 300w\" sizes=\"(max-width: 480px) 100vw, 480px\" \/><\/p>\n<p>Para hacerlo, debemos empezar creando dos personajes, en este caso dos c\u00edrculos de diferentes colores. Lo podemos hacer exactamente igual que hemos hecho al crear el rect\u00e1ngulo del ejercicio inspirado en Hugonin. Despu\u00e9s debemos crear las tres variables: una que se llame \u00abrosa\u00bb, que guardar\u00e1 el n\u00famero de clics realizados sobre el c\u00edrculo rosa; una que se llame \u00abazul\u00bb, que guardar\u00e1 el n\u00famero de clics hechos sobre el c\u00edrculo azul, y una que se llame \u00abtotal\u00bb, que guardar\u00e1 la suma de clics en los dos c\u00edrculos. A partir de aqu\u00ed, la programaci\u00f3n es muy sencilla.<\/p>\n<figure id=\"attachment_1343\" aria-describedby=\"caption-attachment-1343\" style=\"width: 352px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" class=\"wp-image-1343 size-full\" src=\"\/wp-content\/uploads\/2019\/10\/20.212_50_cast.png\" alt=\"\" width=\"352\" height=\"360\" srcset=\"\/wp-content\/uploads\/2019\/10\/20.212_50_cast.png 352w, \/wp-content\/uploads\/2019\/10\/20.212_50_cast-293x300.png 293w\" sizes=\"(max-width: 352px) 100vw, 352px\" \/><figcaption id=\"caption-attachment-1343\" class=\"wp-caption-text\"><a href=\"https:\/\/snap.berkeley.edu\/snapsource\/snap.html#present:Username=uoc_tpi&amp;ProjectName=tres%20variables\" target=\"_blank\" rel=\"noopener noreferrer\">Ver el c\u00f3digo<\/a>.<\/figcaption><\/figure>\n<p>El c\u00f3digo mostrado es para programar el c\u00edrculo rosa. Fij\u00e9monos que inicializamos el valor de la variable \u00abrosa\u00bb en 0, e indicamos al personaje que se mueva siempre. Despu\u00e9s, usando un bloque de eventos, establecemos que, \u00abcuando se clique este personaje\u00bb, sumamos 1 en la variable. Y asignamos para siempre a \u00abtotal\u00bb el valor de \u00abrosa\u00bb m\u00e1s \u00abazul\u00bb.<\/p>\n<p>El c\u00edrculo azul lo programamos exactamente igual, pero no es necesario que vayamos actualizando la variable \u00abtotal\u00bb. Basta con que lo hagamos en uno de los personajes. Pasar c\u00f3digo de un personaje a otro es muy f\u00e1cil. Solo debemos arrastrar los cortes de c\u00f3digo que queramos sobre el personaje donde queremos que aparezcan. Esto hace m\u00e1s \u00e1gil la programaci\u00f3n cuando hay muchos personajes que realizan acciones iguales o similares.<\/p>\n<p>Tendremos, pues, dos personajes funcionando en paralelo (los dos c\u00edrculos), pero adem\u00e1s en el c\u00f3digo del c\u00edrculo rosa hay dos peque\u00f1os programas que se ponen en marcha con la bandera verde y que funcionan en paralelo todo el rato: uno para inicializar la variable e ir moviendo el c\u00edrculo, y otro para ir actualizando el valor de \u00abtotal\u00bb.<\/p>\n<p>Repasemos, pues, todo lo que hemos aprendido con un ejercicio en el que emplearemos bucles, aleatoriedad y variables.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>En programaci\u00f3n se usan variables para ir guardando los datos que necesitamos. Son como cajones donde podemos guardar n\u00fameros o cadenas de caracteres. Podemos acceder a ellos cuando queramos, comprobar su contenido y\/o cambiarlo. Con Snap! es muy f\u00e1cil crear variables y utilizarlas. Estos son los bloques que podemos usar para gestionarlas. Haciendo clic en [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"acf":[],"_links":{"self":[{"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/822"}],"collection":[{"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/comments?post=822"}],"version-history":[{"count":4,"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/822\/revisions"}],"predecessor-version":[{"id":1345,"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/822\/revisions\/1345"}],"wp:attachment":[{"href":"http:\/\/quadern-tpi.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/media?parent=822"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}