1
00:00:00,780 --> 00:00:06,234
En nuestra guía paso a paso anterior, aprendimos como hacer un tipo de objeto para representar nuestros dos objetos estilo "Winston",

2
00:00:06,234 --> 00:00:09,234
y luego inicializarlos con los constructores.

3
00:00:09,234 --> 00:00:13,472
Ahora, nuestro objeto no sólo puede estar asociado con propiedades,

4
00:00:13,472 --> 00:00:18,806
también puede estar asociado con funcionalidades. Piensa en el mundo y todos los tipos de objetos que hay en él,

5
00:00:18,806 --> 00:00:26,287
como los humanos. Todos tenemos estatura y edad, pero también tenemos cosas que podemos hacer, como dormir, comer y programar.

6
00:00:26,287 --> 00:00:30,939
Y queremos poder asociar esas funciones con esos tipos de objetos.

7
00:00:30,939 --> 00:00:35,949
En este programa, que está como lo dejamos la última vez, tenemos una función,

8
00:00:35,949 --> 00:00:43,066
"drawWinston", que llamamos con los dos objetos "Winston". ¿No estaría bien que ligaramos esa función

9
00:00:43,066 --> 00:00:48,569
al tipo de objeto "Winston"?, Bueno, podemos hacerlo y es fácil.

10
00:00:48,569 --> 00:00:55,725
Así que debajo de nuestro constructor, vamos a escribir "Winston", con "W" mayúscula, punto "prototype".

11
00:00:55,725 --> 00:00:59,232
"Prototype" (prototipo), es una palabra nueva que probablemente no habías visto antes.

12
00:00:59,232 --> 00:01:05,881
Y "prototype" es la propiedad de un objeto a la que podemos ligar funciones,

13
00:01:05,881 --> 00:01:13,309
y eso significa que cada objeto que sea una instancia de este objeto tendrá esas funciones.

14
00:01:13,309 --> 00:01:19,612
Así que podemos escribir: punto "prototype" y luego punto, y el nombre de la función, en este caso "draw",

15
00:01:19,612 --> 00:01:25,606
igual a... y podemos tomar el código de la función "drawWinston" y ponerlo aquí,

16
00:01:25,606 --> 00:01:32,951
moverlo aquí dentro. Muy bien, lo que hicimos fue ligar la función "draw"

17
00:01:32,951 --> 00:01:40,008
con nuestro prototipo "Winston". Y eso significa que podremos llamar la función "draw()" desde cualquier objeto tipo "Winston".

18
00:01:40,008 --> 00:01:45,411
Muy bien, entonces podemos llamar la función "draw()" en "winstonTeen" o en "winstonAdult".

19
00:01:45,411 --> 00:01:49,569
Y cuando tenemos una función como ésta, la podemos llamar en el objeto,

20
00:01:49,569 --> 00:01:54,833
y en realidad a esto lo llamamos "método", así que ahora me oirás decir "método".

21
00:01:54,833 --> 00:01:58,272
Entonces digamos que esto es "el método dibujar" ("the draw method"). Ok.

22
00:01:58,272 --> 00:02:04,103
Así que ahora borramos esto, y vamos a ver si podemos llamar a "draw()".

23
00:02:04,103 --> 00:02:07,069
"winstonTeen.draw()"

24
00:02:07,069 --> 00:02:13,697
Ok. Tenemos un error, tenemos este error aquí afuera que dice: "winstObject is not defined".

25
00:02:13,697 --> 00:02:20,530
Ok. Entonces, antes estábamos pasando este argumento a la función "drawWinston", que era el objeto "Winston",

26
00:02:20,530 --> 00:02:26,462
pero ahora ya no lo estamos pasando. Podríamos cambiar esto y pasarlo,

27
00:02:26,462 --> 00:02:30,819
y luego, déjenme ver, ¿qué deberíamos pasar aquí? Tenemos que pasar "winstonTeen". Ok.

28
00:02:30,819 --> 00:02:38,441
Esto funciona, pero es muy tonto hacer esto. Estoy llamando la función "draw" sobre el mismo objeto.

29
00:02:38,441 --> 00:02:43,965
No debería pasar el objeto. Esto es redundante.

30
00:02:43,965 --> 00:02:48,465
Y es cierto, no debemos hacer eso, vamos a borrar esto y pensemos un poco.

31
00:02:48,465 --> 00:02:54,404
Si estamos dentro del objeto, ¿qué podríamos usar para acceder a las propiedades del objeto?

32
00:02:54,404 --> 00:03:00,374
Bueno, deberíamos fijarnos en nuestro constructor y recordar la palabra clave "this" y pensar: "Ah,

33
00:03:00,374 --> 00:03:08,573
debemos cambiar esto por 'this'". Así que cambiamos "winstObject" por "this".

34
00:03:08,573 --> 00:03:12,951
Porque ahora estamos dentro del objeto. Esta función está siendo evaluada

35
00:03:12,951 --> 00:03:16,861
en el objeto, así que "this" se refiere al objeto actual.

36
00:03:16,861 --> 00:03:23,271
Y de esta manera podemos usar simplemente "this" y estaremos teniendo acceso a todas las propiedades del objeto actual.

37
00:03:23,271 --> 00:03:26,720
Y eso funciona totalmente, ¿Lo ven? ¿No es genial?

38
00:03:26,720 --> 00:03:31,907
Entonces ahora podemos escribir "winstonAdult.draw()".

39
00:03:31,907 --> 00:03:38,271
¡Tan tan! Y tendrá acceso a las propiedades de "winstonAdult" porque es el objeto en el que se llama.

40
00:03:38,271 --> 00:03:45,752
Esto es lo bueno de esta palabra clave "this", aunque a veces puede ser un poco confuso usarla.

41
00:03:45,752 --> 00:03:52,028
Muy bien, esto ha sido muy divertido, así que añadamos otro método. Ok. ¿Qué más podría hacer "Winston"?

42
00:03:52,028 --> 00:04:01,078
Tal vez hablar. Así que haremos un "Winston.prototype.talk". Podemos ligar tantos métodos como queramos al prototipo.

43
00:04:01,078 --> 00:04:05,241
Así que vamos a decir: "I´m Winston" ("Soy Winston").

44
00:04:05,241 --> 00:04:13,181
Y luego lo escribimos en "this.x+20" y "this.y+150".

45
00:04:13,181 --> 00:04:19,734
Entonces vemos que no pasa nada, pero es porque todavía no he llamado esa función.

46
00:04:19,734 --> 00:04:25,068
Así que hagamos hablar al adolescente, "winstonTeen.talk()", ok,

47
00:04:25,068 --> 00:04:30,479
"I´m Winston" ¡Tan tan! Y luego "winstonAdult.talk()".

48
00:04:30,479 --> 00:04:36,828
¡Tan tan! Muy bien, ahora tenemos este tipo de objeto "Winston" que tiene propiedades: "nickname",

49
00:04:36,828 --> 00:04:45,026
"age"," x", "y"; y tiene funcionalidad: comportamiento, métodos, que actúan de forma diferente dependiendo de las propiedades.

50
00:04:45,026 --> 00:04:51,123
Y podemos crear tantas instancias de "Winston" como queramos, y llamar cualquiera de estos método en ellos.

51
00:04:51,123 --> 00:04:53,173
Bastante bien ¿o no?