WEBVTT 00:00:01.203 --> 00:00:04.126 Bueno, tengo a mi buen amigo Winston aquí para ayudarnos con éste. 00:00:04.126 --> 00:00:06.793 Y sé que ya se ve imposiblemente genial. 00:00:06.793 --> 00:00:09.292 Pero me parece que quiero cambiar el tamaño de sus ojos un poco. 00:00:09.292 --> 00:00:11.126 Así que aquí es donde dibujo sus ojos. 00:00:11.126 --> 00:00:13.666 Puedes ver que configuramos el color de relleno y dibujamos dos elipses, 00:00:13.666 --> 00:00:17.333 y si quiero hacer esta elipse más pequeña, puedo cambiar el ancho, 00:00:17.333 --> 00:00:20.232 pero también quiero que sea redonda así que cambiaré el alto, 00:00:20.232 --> 00:00:21.793 para que sea el mismo valor. 00:00:21.793 --> 00:00:24.833 Y si también queremos que ambos ojos sean del mismo tamaño, deberíamos cambiar 00:00:24.833 --> 00:00:26.954 el alto y el ancho de este ojo. Pero ahora son un poco pequeños. 00:00:26.954 --> 00:00:29.075 Así que los cambiaré nuevamente. 00:00:29.075 --> 00:00:33.003 ¿No sería grandioso que pudiera cambiar sólo un número y que ambos ojos cambiaran? 00:00:33.003 --> 00:00:37.624 Y aquí, es donde entran en juego las "variables". 00:00:37.624 --> 00:00:39.497 Ahora, una variable es tan sólo como un nombre 00:00:39.497 --> 00:00:41.570 o contenedor para algo más. 00:00:41.570 --> 00:00:44.372 A mí me gusta pensar que una variable es un gran balde con nombre. 00:00:44.372 --> 00:00:46.620 Puedes poner cualquier cosa que quieras en el balde, 00:00:46.620 --> 00:00:48.287 pero el nombre se mantiene igual. 00:00:48.287 --> 00:00:52.536 Llamamos a lo que está dentro del balde, el "valor" de la variable. 00:00:53.612 --> 00:00:57.020 Así que, comencemos haciendo una variable bien arriba, aquí. 00:00:57.574 --> 00:00:59.075 Todo lo que voy hacer es tipear "var" 00:00:59.075 --> 00:01:03.106 que significa "variable", un espacio y luego el nombre de la variable, 00:01:03.106 --> 00:01:05.126 que debería describir lo que va a contener la variable, 00:01:05.126 --> 00:01:07.122 así que la llamaremos eyeSize (tamañoDelOjo). 00:01:07.122 --> 00:01:08.744 Y básicamente, puedes ponerle el nombre que quieras, 00:01:08.744 --> 00:01:10.502 pero no se permite poner espacios entre las palabras del nombre. 00:01:10.502 --> 00:01:12.711 Y, por supuesto, no olvides el punto y coma. 00:01:12.711 --> 00:01:14.667 Entonces, ahora tenemos una variable llamada eyeSize, 00:01:14.667 --> 00:01:17.044 porque va a contener el tamaño de los ojos de Winston, 00:01:17.044 --> 00:01:19.597 pero hasta ahora, esta variable no tiene un valor aún. 00:01:19.597 --> 00:01:21.541 Para darle un valor, sólo le decimos... 00:01:21.541 --> 00:01:27.445 eyeSize = 20 (eyeSize, luego un signo igual y luego 20). 00:01:27.906 --> 00:01:29.794 Ok, ¿Ves ese símbolo "=" (igual)? 00:01:29.794 --> 00:01:32.262 Olvídate lo que te haya dicho tu profesor de matemática, 00:01:32.262 --> 00:01:34.273 Ese signo de igual, no significa "iguales", 00:01:34.273 --> 00:01:36.014 significa "asignación". 00:01:36.137 --> 00:01:42.127 Esto significa que estamos asignando el valor 20 a la variable eyeSize. 00:01:42.127 --> 00:01:45.741 En otras palabras, estamos poniendo el número "20" en el balde llamado eyeSize. 00:01:45.741 --> 00:01:50.654 Y ¿Recuerdas como, en la clase de matemáticas, podías decir algo como x es igual a 3, 00:01:50.737 --> 00:01:53.792 y 3 es igual a x, y era lo mismo? Porque... 00:01:53.792 --> 00:01:56.545 ... Daah, son iguales!... Bueno, no puedes hacer esto aquí tampoco. 00:01:56.545 --> 00:02:00.375 La cosa a la izquierda del signo igual es siempre la variable, 00:02:00.375 --> 00:02:05.600 y la cosa a la derecha del signo = , es siempre el valor que estás asignando a la variable. 00:02:05.600 --> 00:02:08.242 Una buena manera de ayudarte recordar cuál lado es qué, es... 00:02:08.242 --> 00:02:11.629 ... mientras programas y hablas, acostúmbrate como cualquier programador hace, 00:02:11.629 --> 00:02:15.876 a decir "recibe" en lugar de "igual" al encontrarte con un signo =. 00:02:15.876 --> 00:02:19.099 Entonces, esto se convierte en "eyeSize recibe 20". 00:02:19.099 --> 00:02:22.123 Y ahora, cada vez que utilice eyeSize en nuestro programa, 00:02:22.123 --> 00:02:24.621 la computadora, es como que dirá "ah sí, es una variable... 00:02:24.621 --> 00:02:28.287 ... yo sé lo que significa en realidad. Es este valor 20". 00:02:28.287 --> 00:02:30.540 Así que mira, voy a copiar esto... 00:02:30.540 --> 00:02:34.373 ... y luego, reemplazar estos 4 números... 00:02:34.373 --> 00:02:38.622 ... por mi nueva variable eyeSize, 00:02:38.622 --> 00:02:41.372 y voilá!!!! Los ojos de Winston son ahora, 00:02:41.372 --> 00:02:43.041 ambos, perfectamente redondos 00:02:43.041 --> 00:02:46.898 y del mismo tamaño. Y si quiero cambiar el valor de ambos ojos, 00:02:46.898 --> 00:02:51.333 , es decir, el tamaño de los ojos, podría cambiar el valor de esta única variable. 00:02:51.333 --> 00:02:54.877 ¡Ay!! ¡Genial! 00:02:54.877 --> 00:02:56.045 Ok, un par de notas más. 00:02:56.045 --> 00:02:58.870 Aquí arriba, hicimos una nueva variable llamada eyeSize, 00:02:58.870 --> 00:03:01.338 y aquí, le dimos el valor 33. 00:03:01.338 --> 00:03:03.563 En realidad, podemos hacer, todo en un sólo paso diciendo: 00:03:03.563 --> 00:03:08.835 var eyeSize = 33; (eyeSize recibe 33), 00:03:08.912 --> 00:03:10.702 y si elimino estas dos líneas, 00:03:10.702 --> 00:03:13.953 puedes ver que todo funciona todavía. 00:03:13.953 --> 00:03:17.045 También, recuerda que la computadora lee tu código de arriba hacia abajo, 00:03:17.045 --> 00:03:20.099 así que la única razón por la que supo qué significaba eyeSize aquí abajo, 00:03:20.099 --> 00:03:22.167 es porque ya la habíamos definido aquí arriba. 00:03:22.167 --> 00:03:25.119 Si en lugar de ello, la pusiera aquí abajo, 00:03:25.119 --> 00:03:27.771 entonces, cuando lleguemos a esta línea del código, 00:03:27.771 --> 00:03:30.076 la computadora pensará "¿eyeSize? no sé lo que es eyeSize". 00:03:30.076 --> 00:03:34.233 De hecho, aquí recibimos un error que dice "eyeSize no está definido". 00:03:34.233 --> 00:03:37.738 Y quizás pienses "sí, la definí, está aquí mismo". 00:03:37.738 --> 00:03:40.876 Pero la computadora no es tan astuta y no lo entiende. 00:03:40.876 --> 00:03:44.794 Así que movámosla de nuevo hacia arriba, 00:03:44.794 --> 00:03:49.664 y siempre tienes que asegurarte de definir tu variable, antes de tratar de usarla. 00:03:49.664 --> 00:03:53.000 Y, ahora, ya sabes acerca de variables, Yeeeeeeaaahh!