1
00:00:02,016 --> 00:00:04,164
Entonces, ya hicimos esta variable super genial,

2
00:00:04,164 --> 00:00:05,512
para los ojos de Winston,

3
00:00:05,512 --> 00:00:08,179
que ha sido de mucha ayuda
porque nos ahorra mucho tipeo,

4
00:00:08,179 --> 00:00:10,686
para cuando querramos cambiar el tamaño
de los ojos de Winston.

5
00:00:10,686 --> 00:00:13,764
Recuerda, antes teníamos que tipear
el mismo número ¡4 veces!,

6
00:00:13,764 --> 00:00:16,017
cada vez que queríamos cambiar 
el tamaño de ojos de Winston.

7
00:00:16,017 --> 00:00:19,300
Pero ¿Podemos usar variables para reemplazar números cuando no sean todos iguales?

8
00:00:19,300 --> 00:00:21,854
Como, ¿Qué tal si quiero mover a Winston un poquito?

9
00:00:21,854 --> 00:00:24,101
Podríamos cambiar cada uno de estos valores para X,

10
00:00:24,101 --> 00:00:26,908
pero no son todos iguales, 
así que no puedo simplemente...

11
00:00:26,908 --> 00:00:28,520
... reemplazarlos todos por una variable.

12
00:00:28,520 --> 00:00:29,764
Pero ¡espera!

13
00:00:29,764 --> 00:00:31,602
Una vez que le asigno un número a una variable,

14
00:00:31,602 --> 00:00:34,684
puedo usar esa variable, exactamente igual a como si fuera un número,

15
00:00:34,684 --> 00:00:37,308
lo que significa, que puedo usar variables en expresiones matemáticas.

16
00:00:37,308 --> 00:00:38,687
Así que, qué tal esto...

17
00:00:38,687 --> 00:00:40,929
Hagamos una variable para la posición X de Winston,

18
00:00:40,929 --> 00:00:44,398
la llamaremos var x.
Suficientemente simple...

19
00:00:44,398 --> 00:00:48,187
Y ahora démosle el valor de la coordenada X 
de la cara de Winston.

20
00:00:48,187 --> 00:00:51,669
Así que la cara está siendo dibujada 
en la coordenada X 200.

21
00:00:51,669 --> 00:00:54,688
Así que diremos var x=200;
(x recibe 200)

22
00:00:54,688 --> 00:00:59,333
Ahora, puedo reemplazar este número,
por mi nueva variable x.

23
00:00:59,333 --> 00:01:02,846
Queremos mover el valor x
y mover la cara de Winston.

24
00:01:02,846 --> 00:01:06,300
Pero no sus ojos ni su boca.
Así que para arreglar eso,

25
00:01:06,300 --> 00:01:10,675
vamos a definir la posición de sus ojos
y su boca,

26
00:01:10,675 --> 00:01:14,143
en una posición "relativa"
a la posición de su cara.

27
00:01:14,143 --> 00:01:17,931
Así que, las coordenadas x serán el centro
de todas las elipses,

28
00:01:17,931 --> 00:01:22,680
y su cara está siendo dibujada en...
... esto es 200,

29
00:01:22,680 --> 00:01:25,130
y veamos su ojo izquierdo primero.

30
00:01:25,130 --> 00:01:26,872
Así que esta elipse es su ojo izquierdo,

31
00:01:26,872 --> 00:01:29,901
y vemos que está siendo dibujada en 150,

32
00:01:29,901 --> 00:01:33,566
... justo aquí, esto es 150.

33
00:01:33,566 --> 00:01:37,644
Y yo sé que 150 es "50 menos que 200",

34
00:01:37,644 --> 00:01:41,346
así que su ojo izquierdo debería estar 
en "donde sea que esté su cara...

35
00:01:41,346 --> 00:01:42,899
...menos 50".

36
00:01:42,899 --> 00:01:47,932
Así que sería x, que es la posición de su cara, menos 50 ( x-50 ),

37
00:01:47,932 --> 00:01:52,705
y ahora si cambio el valor de x,
su ojo se mueve junto con su cara.

38
00:01:52,705 --> 00:01:54,896
Hagamos lo mismo con los otros.

39
00:01:54,896 --> 00:01:58,429
Entonces, su ojo derecho está siendo dibujado en 300, puedo ver...

40
00:01:58,429 --> 00:02:01,740
Entonces, esto aquí... es 300.

41
00:02:01,740 --> 00:02:06,098
Y 300, sé que es "100 más que 200".

42
00:02:06,098 --> 00:02:09,102
Así que su ojo derecho debería estar, en
"donde sea que esté su cara...

43
00:02:09,102 --> 00:02:10,515
... más 100".

44
00:02:10,515 --> 00:02:12,800
Eso es x + 100.

45
00:02:12,800 --> 00:02:17,104
Y ahora, vamos con la boca.
La boca está siendo dibujada en 250,

46
00:02:17,104 --> 00:02:21,021
aquí tenemos 250. 
y 250 es...

47
00:02:21,021 --> 00:02:24,007
"200 más 50".

48
00:02:24,007 --> 00:02:27,473
Entonces es, 
"donde sea que su cara esté...

49
00:02:27,473 --> 00:02:30,939
x más 50". (x + 50).

50
00:02:30,939 --> 00:02:34,406
Y ahora, me voy a deshacer de estas líneas,

51
00:02:34,406 --> 00:02:36,356
y cada vez que modifico el valor de x,

52
00:02:36,356 --> 00:02:38,134
se mueve toda su cara.

53
00:02:39,442 --> 00:02:41,248
Ahora, antes de que continúes, 
deberías saber...

54
00:02:41,248 --> 00:02:43,430
... un par de cosas más acerca de las variables.

55
00:02:43,430 --> 00:02:47,271
Una vez que creas una variable, utilizando "var x", puedes asignarle un valor,

56
00:02:47,271 --> 00:02:49,039
tantas veces como quieras.

57
00:02:49,039 --> 00:02:51,809
Así que luego de darle el valor a x de 198,

58
00:02:51,809 --> 00:02:55,184
podríamos decir x recibe 300,

59
00:02:55,184 --> 00:02:59,372
o, x recibe 150...

60
00:02:59,372 --> 00:03:01,397
Y a partir de allí, la computadora va a tratar a x,

61
00:03:01,397 --> 00:03:04,233
con lo que sea que le hayamos asignado la última vez.

62
00:03:04,233 --> 00:03:05,806
Así que en este caso, 150.

63
00:03:05,806 --> 00:03:08,736
Pero sólo necesitas tipear "var", una vez por variable.

64
00:03:08,736 --> 00:03:15,974
Si, aquí, hubiera tipeado "var x = 150;"
se habría creado una variable nueva por completo,

65
00:03:15,974 --> 00:03:19,267
de nombre x, destruyendo completamente la variable vieja en el proceso,

66
00:03:19,267 --> 00:03:21,873
así que todas estas variables se van, al tacho.

67
00:03:21,873 --> 00:03:24,562
Y luego, la computadora sólo usará la nueva variable.

68
00:03:24,562 --> 00:03:26,513
A veces, puedes hacer este tipo de cosas,

69
00:03:26,513 --> 00:03:28,306
sin que cosas horribles te pasen,

70
00:03:28,306 --> 00:03:30,188
pero yo no lo aconsejaría.

71
00:03:30,188 --> 00:03:33,662
Por ahora, sólo lo haremos una vez.
var x = 150;

72
00:03:33,662 --> 00:03:37,847
Y ahora, convenientemente, puedo mover toda la cara de Winston fuera de la pantalla,

73
00:03:37,847 --> 00:03:40,505
así puedo hablarles del siguiente punto.

74
00:03:40,505 --> 00:03:44,572
Así que, cada vez que tienes una variable igual algo
(x = algo),

75
00:03:44,777 --> 00:03:47,769
esa variable está en un lugar seguro y feliz.

76
00:03:47,769 --> 00:03:51,520
De hecho, a la izquierda del signo igual, es el único lugar,

77
00:03:51,520 --> 00:03:53,686
en donde la variable puede sentirse como ella misma,

78
00:03:53,686 --> 00:03:57,641
porque ese es el único lugar en donde la computadora la considerará una variable.

79
00:03:57,641 --> 00:04:00,374
En cualquier otro lugar, la computadora sólo hará de cuenta que es un valor,

80
00:04:00,374 --> 00:04:07,443
así que aunque que podemos hacer algo como esto:
"var x recibe 10" y luego,

81
00:04:07,443 --> 00:04:11,064
x recibe x,

82
00:04:11,064 --> 00:04:14,741
uh, confuso...
bueno, a la izquierda, tenemos x,

83
00:04:14,741 --> 00:04:20,620
como una variable independiente y librepensadora,
que puede crecer, puede cambiar,

84
00:04:20,636 --> 00:04:26,797
pero en la derecha...
sólo es 10... ¡Tan triste!.

85
00:04:26,797 --> 00:04:29,018
Pero eso significa que podemos hacer cosas realmente útiles como esta,

86
00:04:29,018 --> 00:04:34,004
Puedo decir x recibe x más 1,

87
00:04:34,004 --> 00:04:37,122
así que en la izquierda, tenemos nuestra variable en lugar seguro y feliz...

88
00:04:37,199 --> 00:04:43,095
... en la derecha, tenemos esta variable,
que sabemos que es básicamente sólo un número

89
00:04:43,095 --> 00:04:44,602
así que es 10.

90
00:04:44,602 --> 00:04:47,912
Así que podemos reemplazarla mentalmente, con 
x recibe 10 más 1,

91
00:04:47,912 --> 00:04:51,964
que sólo significa que x recibe 11.

92
00:04:51,964 --> 00:04:54,829
Así que toda está línea, sólo dice que
x recibe 11,

93
00:04:54,829 --> 00:04:58,107
y a partir de ahora, el valor de x es 11.

94
00:04:58,107 --> 00:05:01,194
Veamos qué ocurre, si metemos otra variable en la ecuación.

95
00:05:01,194 --> 00:05:06,688
Voy a hacer
var x = 10;

96
00:05:06,688 --> 00:05:10,855
var y = 20;

97
00:05:10,855 --> 00:05:13,020
x = y;

98
00:05:13,020 --> 00:05:17,696
y = 7;

99
00:05:17,696 --> 00:05:22,566
Ok, lo que quiero saber es cuál es el valor de x.

100
00:05:22,566 --> 00:05:25,691
Averiguémosolo, así que esta línea aquí,

101
00:05:25,691 --> 00:05:29,604
hace una nueva variable x y le asigna el valor 10,

102
00:05:29,604 --> 00:05:32,131
así que el valor de x es 10.

103
00:05:32,131 --> 00:05:36,076
En esta línea, estamos haciendo una nueva variable y dándole el valor 20,

104
00:05:36,076 --> 00:05:39,693
no le hacemos nada a x,
así que el valor de x sigue siendo 10.

105
00:05:39,693 --> 00:05:43,778
Aquí, decimos "x recibe y", y es un poco confuso,

106
00:05:43,778 --> 00:05:46,566
pero si piensas en ello, sabemos que 
sólo una de estas variables

107
00:05:46,566 --> 00:05:49,781
está en el lugar seguro y feliz,
pero la otra variable,

108
00:05:49,781 --> 00:05:53,999
está siendo tratada exactamente
como si fuera un número.

109
00:05:53,999 --> 00:05:58,276
Así que aquí podemos reemplazar mentalmente esta "y" con este valor, sólo 20...

110
00:05:58,276 --> 00:06:01,907
... y sabemos que lo que esta línea significa en realidad es que "x recibe 20".

111
00:06:01,907 --> 00:06:05,445
Entonces, el valor de x aquí es... 20.

112
00:06:05,445 --> 00:06:09,732
Y luego, aquí tenemos a "y" en el lugar seguro y feliz esta vez,

113
00:06:09,732 --> 00:06:13,190
pero no es tan confuso, porque tenemos solo un número en el otro lado.

114
00:06:13,190 --> 00:06:14,941
Así que aqúi está la gran pregunta...

115
00:06:14,941 --> 00:06:21,560
Cuando cambio el valor de "y" aquí: 
¿Eso modifica el valor de x aquí arriba?

116
00:06:21,560 --> 00:06:22,934
Y la respuesta:

117
00:06:22,934 --> 00:06:25,665
¡NOOOO...
no, no, no, no!

118
00:06:25,665 --> 00:06:30,186
Tienes que recordar,
aquí arriba, "y" está siendo tratada

119
00:06:30,186 --> 00:06:31,806
como un número.

120
00:06:31,806 --> 00:06:34,354
La computadora va a ignorar completamente
que es una variable...

121
00:06:34,354 --> 00:06:38,331
... olvidarse del hecho de que puede cambiar...
y sólo decir...

122
00:06:38,331 --> 00:06:42,968
"Oh, 'y', lo que en realidad quieres decir es 20".

123
00:06:42,968 --> 00:06:45,275
Entonces, aquí sólo estamos asignando un número a x,

124
00:06:45,275 --> 00:06:49,609
no estamos asignando una variable,
estamos asignando el valor de y, que es 20.

125
00:06:49,609 --> 00:06:54,612
Y eso significa, que el valor de x
se mantiene en 20,

126
00:06:54,612 --> 00:06:59,883
incluso luego de que cambiamos el valor
de esta variable "y" en la última línea.

127
00:07:00,143 --> 00:07:02,233
¡Ufff!
¿Capisce?

128
00:07:02,341 --> 00:07:06,023
Bueno, ahora muchachos, ya son
expertos totales en variables...

129
00:07:06,023 --> 00:07:10,000
¡¡¡Felicitaciones!!!