1
00:00:00,000 --> 00:00:02,817
Empecemos a programar.

2
00:00:02,817 --> 00:00:05,635
Necesitamos comenzar entendiendo formas, los conceptos básicos.

3
00:00:05,635 --> 00:00:07,803
Pero no te preocupes, en breve, tus formas estarán volando por la pantalla y cambiando el color

4
00:00:07,803 --> 00:00:10,803
y haciendo todo tipo de cosas de programación entretenidas.

5
00:00:10,803 --> 00:00:12,772
Sólo ¡quédate con nosotros!

6
00:00:12,772 --> 00:00:14,636
Así que comencemos a dibujar rectángulos.

7
00:00:14,636 --> 00:00:20,870
Escribimos rect() por rectángulo, luego abrimos paréntesis, y luego cuatro números y explicaré qué significan en un rato.

8
00:00:20,870 --> 00:00:23,938
...luego cerramos los paréntesis, y al final ponemos punto y coma.

9
00:00:23,938 --> 00:00:26,005
Mira, asombroso, ¡un rectángulo!

10
00:00:26,005 --> 00:00:29,670
Y eso fue tan simple, así que hagámoslo de nuevo. Podemos probar diferentes números esta vez.

11
00:00:29,670 --> 00:00:36,171
Quizás números más grandes, y luego números más chicos al final, y ¡ey!, mira, otro rectángulo.

12
00:00:36,171 --> 00:00:41,003
De hecho, si intentamos cambiar este primer número para hacerlo más pequeño, se empezará a mover.

13
00:00:41,003 --> 00:00:44,968
Si cambiamos este último número para hacerlo más grande y luego más pequeño,

14
00:00:44,968 --> 00:00:47,968
entonces sólo crecerá y luego se achicará. Interesante.

15
00:00:47,968 --> 00:00:51,885
Entonces, probablemente te preguntarás: ¿Cómo es que está pasando toda esta magia?

16
00:00:51,885 --> 00:00:55,506
Bueno, recuerda que tu computadora es como un perro realmente inteligente y obediente.

17
00:00:55,506 --> 00:00:59,978
A un perro, quizás podamos decirle que se siente, se quede quieto, o incluso ruede sobre sí mismo.

18
00:00:59,978 --> 00:01:02,113
Sólo tendrías que darle comando sit().

19
00:01:02,113 --> 00:01:06,172
Entonces, en código, ¿Cómo le dirías a tu perro de computadora que se siente?

20
00:01:06,172 --> 00:01:09,909
Bueno, la manera en la que podrías hacerlo, sería escribiendo el nombre del comando,

21
00:01:09,909 --> 00:01:15,129
digamos "sit" y dos paréntesis, luego para decirle que haga el comando que acabas de decirle,

22
00:01:15,129 --> 00:01:19,719
y luego un punto y coma al final para decir "sí, este comando termina aquí".

23
00:01:19,719 --> 00:01:22,219
Y luego tu perro de computadora se sentaría.

24
00:01:22,219 --> 00:01:27,711
Bueno, por supuesto, tu computadora en Khan Academy, no es un perro, por ello no sabe cómo sentarse o rodar,

25
00:01:27,711 --> 00:01:32,241
pero sí sabe cómo dibujar rectángulos, cuando llamas a rect() y esos es bastante interesante también, ¿No?

26
00:01:32,241 --> 00:01:37,395
Así que, eso es lo que vamos a hacer en esta línea. Diremos el comando rect(), que es sólo el nombre,

27
00:01:37,395 --> 00:01:40,495
y luego abriremos paréntesis y cerraremos paréntesis para decir "ve y haz eso",

28
00:01:40,495 --> 00:01:43,495
y luego el punto y coma al final.

29
00:01:43,495 --> 00:01:47,436
Así es que tu computadora sabe ir y hacer esta habilidad especial rect.

30
00:01:47,436 --> 00:01:49,967
Ok, entonces, volvamos a nuestro rect.

31
00:01:49,967 --> 00:01:53,672
Tenemos el nombre del comando aquí mismo, tenemos los paréntesis.

32
00:01:53,672 --> 00:01:56,240
¿Y qué hay acerca de todos esos números locos?

33
00:01:56,240 --> 00:02:01,552
Bueno, la idea es que la computadora realmente no sabe lo suficiente si sólo le dices que "rect".

34
00:02:01,552 --> 00:02:05,329
Para entender esto, imagínate si te diera un papel,

35
00:02:05,329 --> 00:02:09,669
y yo quisiera que dibujes un rectángulo exactamente en la manera en la que yo quisiera que sea.

36
00:02:09,669 --> 00:02:15,106
Bueno, a menos que me puedas leer la mente, vas a hacer algunas preguntas de inmediato.

37
00:02:15,106 --> 00:02:19,302
Primero, pensarás "bueno, ok, ¿Dónde quieres que dibuje el rectángulo?"

38
00:02:19,302 --> 00:02:27,456
Y luego, Yo diría "qué tal si acordamos en llamar a este lado izquierdo del papel 0 (cero) "

39
00:02:27,456 --> 00:02:30,245
Y convengamos en que este lado derecho del papel va a ser "400".

40
00:02:30,245 --> 00:02:37,536
Entonces, podría darte un número, como 100, y tú sabrías que eso sería básicamente ahí.

41
00:02:37,536 --> 00:02:43,884
Eso te convencería por un rato, pero luego dirías: "Ok, eso me dice cuán lejos a lo largo, pero qué tal a lo alto?"

42
00:02:43,884 --> 00:02:49,593
Entonces, yo podría darte otro número, como 200, y diría que el borde superior es 0 (cero),

43
00:02:49,593 --> 00:02:57,553
y luego el inferior es 400, y pensarías: "Bueno, 200 va a estar justo en el medio".

44
00:02:57,553 --> 00:03:02,970
Y esto está perfecto, porque ahora piensas: "Ok, voy a dibujar tu rectángulo justo aquí".

45
00:03:02,970 --> 00:03:06,670
...porque es 100 a lo largo y 200 a lo alto.

46
00:03:06,670 --> 00:03:09,886
Excepto que, eso todavía no es suficiente información, porque qué te preguntas ahora...

47
00:03:09,886 --> 00:03:12,728
Piensas, cuán grande quiero el rectángulo.

48
00:03:12,728 --> 00:03:17,468
Yo diría: "¿Qué tal, 150 de ancho?"

49
00:03:17,468 --> 00:03:21,168
Y tú pensarías: "Bueno, esto es 100 y esto es 400,

50
00:03:21,168 --> 00:03:26,248
así que si quisiéramos que sea 150 de ancho, quizás haríamos esto".

51
00:03:26,248 --> 00:03:29,131
Ok, fantástico, eso es más o menos 150 de ancho.

52
00:03:29,131 --> 00:03:31,538
Entonces, tú dirías: "¿Cuán alto lo quieres?"

53
00:03:31,538 --> 00:03:33,468
Y yo diría: "¿Qué tal 50 de alto?"

54
00:03:33,468 --> 00:03:37,806
Tú dirías: "Ok, 50, eso es aproximadamente así de alto".

55
00:03:37,806 --> 00:03:40,707
Luego, dirías: "Fantástico, sé exactamente dónde quieres el rectángulo,

56
00:03:40,707 --> 00:03:42,487
y exactamente cuán grande quieres que sea,

57
00:03:42,487 --> 00:03:44,957
ahora puedo dibujarlo".

58
00:03:44,957 --> 00:03:48,052
Eso es mucho trabajo para un rectángulo, ¿no?

59
00:03:48,052 --> 00:03:54,393
Pero la idea es que con sólo darte esos 4 números, 100 a lo largo, 200 a lo alto,

60
00:03:54,393 --> 00:04:02,203
150 de ancho y 50 de alto, ahora los dos tenemos la misma idea de cómo debería verse este rectángulo.

61
00:04:02,203 --> 00:04:04,552
Así es cómo piensa la computadora también.

62
00:04:04,552 --> 00:04:10,003
Puedes escribir el nombre del comando, como dijimos, paréntesis, los 4 números

63
00:04:10,003 --> 00:04:16,243
(100, 200, 150, 50), cerrar paréntesis y luego un punto y coma.

64
00:04:16,243 --> 00:04:20,553
¡Y dibujará un retángulo exáctamente en donde queremos que esté!

65
00:04:20,553 --> 00:04:24,265
Bueno, si somos honestos, no es allí donde realmente queríamos el rectángulo.

66
00:04:24,265 --> 00:04:25,925
No es allí donde lo dibujamos, ¿verdad?

67
00:04:25,925 --> 00:04:27,915
Nuestros números están un poco desfasados.

68
00:04:27,915 --> 00:04:31,525
Así que vamos y digamos que queremos que concuerde exactamente lo que dibujamos.

69
00:04:31,525 --> 00:04:37,688
Moveremos esto así, está un poco más lejos, un poco menos a lo alto,

70
00:04:37,688 --> 00:04:42,858
un poco más flaco y quizás un poco más bajo.

71
00:04:42,858 --> 00:04:46,344
Ahora logramos que nuestro rectángulo concuerde con lo que dibujamos,

72
00:04:46,344 --> 00:04:49,804
porque entendimos lo que significan estos números y podríamos cambiarlos

73
00:04:49,804 --> 00:04:52,594
para que se vea justo como queremos.

74
00:04:52,594 --> 00:04:55,287
Ahora pensemos en dibujar otro rectángulo

75
00:04:55,287 --> 00:04:59,719
Porque lo lindo de esto es que podemos dibujar rectángulos en donde queramos.

76
00:04:59,719 --> 00:05:04,073
¿Qué tal si dibujamos uno justo en esta esquina superior?

77
00:05:04,073 --> 00:05:06,368
Pensemos en dónde sería eso.

78
00:05:06,368 --> 00:05:11,345
Eso sería 0 (cero) a lo largo, 0 (cero) a lo alto y quizás bastante pequeño,

79
00:05:11,345 --> 00:05:17,065
digamos 50 de ancho y 10 de alto.

80
00:05:17,065 --> 00:05:23,042
Hagámoslo. Escribimos rect, separamos los parámetros con comas,

81
00:05:23,042 --> 00:05:26,182
y digamos que estamos conformes.

82
00:05:26,182 --> 00:05:31,134
Pero oh, tenemos este mensaje de error que dice que nos falta un paréntesis de cierre,

83
00:05:31,134 --> 00:05:35,504
y nos damos cuenta de esto, así que lo agregamos.

84
00:05:35,504 --> 00:05:38,548
Pero uh, ahora tenemos otro error que dice que nos falta un punto y coma.

85
00:05:38,548 --> 00:05:43,026
Si presionamos "show me where" (Múestrame dónde), nos apuntará la línea que acabo de escribir...

86
00:05:43,026 --> 00:05:46,205
... y recordamos que los punto y coma son como puntos al final de las oraciones,

87
00:05:46,205 --> 00:05:49,205
pero para darle fin a las líneas de código, y nos olvidamos de ello.

88
00:05:49,205 --> 00:05:52,754
Podemos agregarlo, no hay problema y todo está bien nuevamente.

89
00:05:52,754 --> 00:05:55,785
Pruébalo, un pequeño rectángulo, exactamente como queríamos.

90
00:05:55,785 --> 00:06:03,373
Al igual que antes, podemos agrandarlo, podemos moverlo y podemos posicionarlo exactamente donde queremos que esté.

91
00:06:03,373 --> 00:06:06,915
Entonces, ahora sabes en detalle cómo funciona "rect".

92
00:06:06,915 --> 00:06:10,711
Cubrimos lo que significan estos números, y el hecho de que siempre necesitas poner el nombre del comando,

93
00:06:10,711 --> 00:06:15,671
los paréntesis, separar los números con comas y poner el punto y coma final.

94
00:06:15,671 --> 00:06:19,490
Parece mucho, pero puedes probarlo tú mismo y empezar a acostumbrarte.

95
00:06:19,490 --> 00:06:22,039
La próxima vez, aprenderemos acerca de hacer más formas,

96
00:06:22,039 --> 00:06:24,445
y luego avanzaremos hacia cosas más asombrosas como usar color

97
00:06:24,445 --> 00:06:25,735
y lograr que vuele por la pantalla.