[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.78,0:00:06.23,Default,,0000,0000,0000,,En nuestra guía paso a paso anterior, aprendimos como hacer un tipo de objeto para representar nuestros dos objetos estilo "Winston", Dialogue: 0,0:00:06.23,0:00:09.23,Default,,0000,0000,0000,,y luego inicializarlos con los constructores. Dialogue: 0,0:00:09.23,0:00:13.47,Default,,0000,0000,0000,,Ahora, nuestro objeto no sólo puede estar asociado con propiedades, Dialogue: 0,0:00:13.47,0:00:18.81,Default,,0000,0000,0000,,también puede estar asociado con funcionalidades. Piensa en el mundo y todos los tipos de objetos que hay en él, Dialogue: 0,0:00:18.81,0:00:26.29,Default,,0000,0000,0000,,como los humanos. Todos tenemos estatura y edad, pero también tenemos cosas que podemos hacer, como dormir, comer y programar. Dialogue: 0,0:00:26.29,0:00:30.94,Default,,0000,0000,0000,,Y queremos poder asociar esas funciones con esos tipos de objetos. Dialogue: 0,0:00:30.94,0:00:35.95,Default,,0000,0000,0000,,En este programa, que está como lo dejamos la última vez, tenemos una función, Dialogue: 0,0:00:35.95,0:00:43.07,Default,,0000,0000,0000,,"drawWinston", que llamamos con los dos objetos "Winston". ¿No estaría bien que ligaramos esa función Dialogue: 0,0:00:43.07,0:00:48.57,Default,,0000,0000,0000,,al tipo de objeto "Winston"?, Bueno, podemos hacerlo y es fácil. Dialogue: 0,0:00:48.57,0:00:55.72,Default,,0000,0000,0000,,Así que debajo de nuestro constructor, vamos a escribir "Winston", con "W" mayúscula, punto "prototype". Dialogue: 0,0:00:55.72,0:00:59.23,Default,,0000,0000,0000,,"Prototype" (prototipo), es una palabra nueva que probablemente no habías visto antes. Dialogue: 0,0:00:59.23,0:01:05.88,Default,,0000,0000,0000,,Y "prototype" es la propiedad de un objeto a la que podemos ligar funciones, Dialogue: 0,0:01:05.88,0:01:13.31,Default,,0000,0000,0000,,y eso significa que cada objeto que sea una instancia de este objeto tendrá esas funciones. Dialogue: 0,0:01:13.31,0:01:19.61,Default,,0000,0000,0000,,Así que podemos escribir: punto "prototype" y luego punto, y el nombre de la función, en este caso "draw", Dialogue: 0,0:01:19.61,0:01:25.61,Default,,0000,0000,0000,,igual a... y podemos tomar el código de la función "drawWinston" y ponerlo aquí, Dialogue: 0,0:01:25.61,0:01:32.95,Default,,0000,0000,0000,,moverlo aquí dentro. Muy bien, lo que hicimos fue ligar la función "draw" Dialogue: 0,0:01:32.95,0:01:40.01,Default,,0000,0000,0000,,con nuestro prototipo "Winston". Y eso significa que podremos llamar la función "draw()" desde cualquier objeto tipo "Winston". Dialogue: 0,0:01:40.01,0:01:45.41,Default,,0000,0000,0000,,Muy bien, entonces podemos llamar la función "draw()" en "winstonTeen" o en "winstonAdult". Dialogue: 0,0:01:45.41,0:01:49.57,Default,,0000,0000,0000,,Y cuando tenemos una función como ésta, la podemos llamar en el objeto, Dialogue: 0,0:01:49.57,0:01:54.83,Default,,0000,0000,0000,,y en realidad a esto lo llamamos "método", así que ahora me oirás decir "método". Dialogue: 0,0:01:54.83,0:01:58.27,Default,,0000,0000,0000,,Entonces digamos que esto es "el método dibujar" ("the draw method"). Ok. Dialogue: 0,0:01:58.27,0:02:04.10,Default,,0000,0000,0000,,Así que ahora borramos esto, y vamos a ver si podemos llamar a "draw()". Dialogue: 0,0:02:04.10,0:02:07.07,Default,,0000,0000,0000,,"winstonTeen.draw()" Dialogue: 0,0:02:07.07,0:02:13.70,Default,,0000,0000,0000,,Ok. Tenemos un error, tenemos este error aquí afuera que dice: "winstObject is not defined". Dialogue: 0,0:02:13.70,0:02:20.53,Default,,0000,0000,0000,,Ok. Entonces, antes estábamos pasando este argumento a la función "drawWinston", que era el objeto "Winston", Dialogue: 0,0:02:20.53,0:02:26.46,Default,,0000,0000,0000,,pero ahora ya no lo estamos pasando. Podríamos cambiar esto y pasarlo, Dialogue: 0,0:02:26.46,0:02:30.82,Default,,0000,0000,0000,,y luego, déjenme ver, ¿qué deberíamos pasar aquí? Tenemos que pasar "winstonTeen". Ok. Dialogue: 0,0:02:30.82,0:02:38.44,Default,,0000,0000,0000,,Esto funciona, pero es muy tonto hacer esto. Estoy llamando la función "draw" sobre el mismo objeto. Dialogue: 0,0:02:38.44,0:02:43.96,Default,,0000,0000,0000,,No debería pasar el objeto. Esto es redundante. Dialogue: 0,0:02:43.96,0:02:48.46,Default,,0000,0000,0000,,Y es cierto, no debemos hacer eso, vamos a borrar esto y pensemos un poco. Dialogue: 0,0:02:48.46,0:02:54.40,Default,,0000,0000,0000,,Si estamos dentro del objeto, ¿qué podríamos usar para acceder a las propiedades del objeto? Dialogue: 0,0:02:54.40,0:03:00.37,Default,,0000,0000,0000,,Bueno, deberíamos fijarnos en nuestro constructor y recordar la palabra clave "this" y pensar: "Ah, Dialogue: 0,0:03:00.37,0:03:08.57,Default,,0000,0000,0000,,debemos cambiar esto por 'this'". Así que cambiamos "winstObject" por "this". Dialogue: 0,0:03:08.57,0:03:12.95,Default,,0000,0000,0000,,Porque ahora estamos dentro del objeto. Esta función está siendo evaluada Dialogue: 0,0:03:12.95,0:03:16.86,Default,,0000,0000,0000,,en el objeto, así que "this" se refiere al objeto actual. Dialogue: 0,0:03:16.86,0:03:23.27,Default,,0000,0000,0000,,Y de esta manera podemos usar simplemente "this" y estaremos teniendo acceso a todas las propiedades del objeto actual. Dialogue: 0,0:03:23.27,0:03:26.72,Default,,0000,0000,0000,,Y eso funciona totalmente, ¿Lo ven? ¿No es genial? Dialogue: 0,0:03:26.72,0:03:31.91,Default,,0000,0000,0000,,Entonces ahora podemos escribir "winstonAdult.draw()". Dialogue: 0,0:03:31.91,0:03:38.27,Default,,0000,0000,0000,,¡Tan tan! Y tendrá acceso a las propiedades de "winstonAdult" porque es el objeto en el que se llama. Dialogue: 0,0:03:38.27,0:03:45.75,Default,,0000,0000,0000,,Esto es lo bueno de esta palabra clave "this", aunque a veces puede ser un poco confuso usarla. Dialogue: 0,0:03:45.75,0:03:52.03,Default,,0000,0000,0000,,Muy bien, esto ha sido muy divertido, así que añadamos otro método. Ok. ¿Qué más podría hacer "Winston"? Dialogue: 0,0:03:52.03,0:04:01.08,Default,,0000,0000,0000,,Tal vez hablar. Así que haremos un "Winston.prototype.talk". Podemos ligar tantos métodos como queramos al prototipo. Dialogue: 0,0:04:01.08,0:04:05.24,Default,,0000,0000,0000,,Así que vamos a decir: "I´m Winston" ("Soy Winston"). Dialogue: 0,0:04:05.24,0:04:13.18,Default,,0000,0000,0000,,Y luego lo escribimos en "this.x+20" y "this.y+150". Dialogue: 0,0:04:13.18,0:04:19.73,Default,,0000,0000,0000,,Entonces vemos que no pasa nada, pero es porque todavía no he llamado esa función. Dialogue: 0,0:04:19.73,0:04:25.07,Default,,0000,0000,0000,,Así que hagamos hablar al adolescente, "winstonTeen.talk()", ok, Dialogue: 0,0:04:25.07,0:04:30.48,Default,,0000,0000,0000,,"I´m Winston" ¡Tan tan! Y luego "winstonAdult.talk()". Dialogue: 0,0:04:30.48,0:04:36.83,Default,,0000,0000,0000,,¡Tan tan! Muy bien, ahora tenemos este tipo de objeto "Winston" que tiene propiedades: "nickname", Dialogue: 0,0:04:36.83,0:04:45.03,Default,,0000,0000,0000,,"age"," x", "y"; y tiene funcionalidad: comportamiento, métodos, que actúan de forma diferente dependiendo de las propiedades. Dialogue: 0,0:04:45.03,0:04:51.12,Default,,0000,0000,0000,,Y podemos crear tantas instancias de "Winston" como queramos, y llamar cualquiera de estos método en ellos. Dialogue: 0,0:04:51.12,0:04:53.17,Default,,0000,0000,0000,,Bastante bien ¿o no?