0:00:01.187,0:00:03.173
Estamos de regreso con nuestro programa para crear "Winstons"

0:00:03.173,0:00:08.799
pero añadí un nuevo tipo de objeto "Hooper" porque "Hooper" se sentía un poco solo.

0:00:08.799,0:00:11.924
Ahora, defino a "Hooper" de la misma manera que definí a "Winston", ya sabes,

0:00:11.924,0:00:15.843
empezando con la función constructora y tomando las mismas propiedades y luego "draw" (dibujar)

0:00:15.843,0:00:19.908
y luego "talk" (hablar), y luego también añadí otro método

0:00:19.908,0:00:25.388
llamado "Horray" porque a los "Hoppers" realmente le gusta celebrar y a los "Winstons" en realidad no.

0:00:25.388,0:00:27.924
Ahora, al final de la función he creado

0:00:27.924,0:00:31.174
dos nuevos objetos "Hooper": "Little Hopper" y "Big Hooper",

0:00:31.174,0:00:36.507
los dibujo y en uno llamo la función "talk" y en el otro "Horray".

0:00:36.507,0:00:37.508
Eso está muy bien.

0:00:37.508,0:00:39.928
Ahora, si miramos este código que está aquí arriba

0:00:39.928,0:00:42.313
te darás cuenta de algo interesante.

0:00:42.313,0:00:49.324
Y es que el código para "Hooper" es muy similar al código para "Winston". Particularmente el constructor.

0:00:49.324,0:00:54.994
No se si recuerdes pero básicamente es el mismo código que nuestra función constructora de"Winston".

0:00:54.994,0:01:00.748
Y luego en esta función "talk" el código es exactamente el mismo que en la función "talk" de "Winston",

0:01:00.763,0:01:03.897
y ambos tienen funciones "draw",

0:01:03.897,0:01:07.272
así que tienen muchas cosas en común en estos dos tipos de objetos,

0:01:07.272,0:01:11.341
y eso tiene sentido porque ya sabes "Hooper" y "Winston" son dos tipos de objetos muy similares

0:01:11.341,0:01:15.299
en nuestro mundo. Si piensas en eso, ya sabes, en el mundo real

0:01:15.299,0:01:20.009
fuera de la computadora, muchos tipos de objetos tienen semejanzas

0:01:20.009,0:01:21.293
con otros tipos de objetos.

0:01:21.293,0:01:25.483
Como en el reino animal. Todos los animales son similares de alguna forma.

0:01:25.483,0:01:29.422
Y luego tenemos diferentes tipos de animales como los humanos.

0:01:29.422,0:01:31.588
Y los humanos comparten esas similitudes

0:01:31.588,0:01:34.331
pero también tiene sus propias similitudes únicas.

0:01:34.331,0:01:35.800
Así que podríamos decir que

0:01:35.800,0:01:41.917
un animal es un tipo de objeto del que el tipo de objeto humano hereda funcionalidad.

0:01:41.917,0:01:46.864
No iniciamos completamente de cero sino que agregamos a la funcionalidad que ya tenemos de ser un animal.

0:01:46.864,0:01:49.196
Como que todos los animales hacen ruidos,

0:01:49.196,0:01:51.407
pero los humanos también tienen lenguaje.

0:01:51.407,0:01:54.123
Así que este concepto de herencia de objetos

0:01:54.123,0:01:56.385
en realidad también es muy útil en programación.

0:01:56.385,0:01:59.865
Y podemos crear una cadena de herencia de objetos en nuestro Javascript.

0:01:59.865,0:02:02.529
Así que para hacer esto cuando piensas

0:02:02.529,0:02:04.425
qué es lo que comparten nuestros tipos de objetos,

0:02:04.425,0:02:06.633
y tienes un nombre para ello,

0:02:06.633,0:02:08.675
porque vamos a crear un tipo de objeto

0:02:08.675,0:02:10.576
que representa el objeto base

0:02:10.576,0:02:13.724
así que vamos a llamarle "Creatures" (criaturas). Ambos son criaturas.

0:02:13.724,0:02:17.973
Así que decimos "var Creature = ". Y ahora necesitamos nuestra función constructora.

0:02:17.973,0:02:22.811
Así que solamente vamos y copiemos la de "Hopper" para que tenga lo mismo que "Winston" tiene.

0:02:22.811,0:02:23.772
Muy bien.

0:02:23.772,0:02:26.632
Y luego, vamos a ver.

0:02:26.632,0:02:27.792
Ahora queremos,

0:02:27.792,0:02:29.425
¿Qué es lo que queremos ahora?

0:02:29.425,0:02:32.846
Tal vez queremos añadirle la función "talk".

0:02:32.846,0:02:39.726
Así que para la función "talk", sólo la copiamos de "Hooper". Pero por supuesto necesitamos que diga "Creature.prototype" en lugar de esto.

0:02:39.726,0:02:41.253
Ok, genial.

0:02:41.253,0:02:45.623
Así que ahora tenemos este tipo de objeto "Creature".

0:02:45.623,0:02:48.870
Pero en realidad necesitamos decirle a "Hooper" que

0:02:48.870,0:02:52.600
"Hooper" debe basar su funcionalidad en "Creature".

0:02:52.600,0:02:55.331
Así que podemos hacer eso escribiendo esta línea aquí.

0:02:55.331,0:03:02.589
Decimos "Hopper.prototype = Object.create"

0:03:02.589,0:03:04.827
"(Creature.prototype);"

0:03:04.827,0:03:09.857
Entonces, lo que hace esta línea es decirle a Javascript que base el prototipo de "Hopper", es decir,

0:03:09.857,0:03:15.027
toda la funcionalidad de "Hopper" en el prototipo de "Creature".

0:03:15.027,0:03:22.307
Y entonces esto significa que cada vez que busque una función en "Hooper" buscará primero en el prototipo de "Hooper"

0:03:22.307,0:03:26.782
pero si no lo encuentra lo buscará en el prototipo de "Creature".

0:03:26.782,0:03:29.849
Y esto es a lo que llamamos cadena de prototipos.

0:03:29.849,0:03:33.926
Ahora una vez que hemos hecho esto deberíamos poder borrar la función "talk".

0:03:33.926,0:03:35.332
En "Hooper".

0:03:35.332,0:03:37.374
Porque ya existe en "Creature".

0:03:37.374,0:03:39.572
Que está más arriba en la cadena de prototipos.

0:03:39.572,0:03:41.621
¿Listo? ¡Tan tan tan!

0:03:41.621,0:03:42.861
¡Funcionó!

0:03:42.861,0:03:48.954
Y funcionó porque encuentra la función en el prototipo de "Creature".

0:03:48.954,0:03:53.674
Mmm. Así que tratemos de borrarla de "Winston" también.

0:03:53.674,0:03:57.864
Ok. No funcionó, nos dice que el objeto no tiene método "talk".

0:03:57.864,0:04:00.890
¿Y por qué es eso? Bueno, tenemos nuestro constructor de "Winston",

0:04:00.890,0:04:02.853
y "draw" y borramos la función "talk".

0:04:02.853,0:04:07.117
Bueno, notarás que en realidad olvidamos decirle que el prototipo de "Winston" debe estar basado

0:04:07.117,0:04:08.474
en el prototipo de "Creature".

0:04:08.474,0:04:10.229
Así que necesitamos esa línea tan importante.

0:04:10.229,0:04:13.571
"Winston.prototype = Object.create"

0:04:13.571,0:04:18.043
"(Creature.prototype);"

0:04:18.043,0:04:18.974
¡Tan tan!

0:04:18.974,0:04:20.530
Y fíjense en algo importante.

0:04:20.530,0:04:25.396
Tengo esta línea después de la función constructora pero antes de añadir cualquier cosa

0:04:25.396,0:04:27.147
al prototipo de "Winston".

0:04:27.147,0:04:28.638
Eso es lo que generalmente quieres hacer.

0:04:28.638,0:04:30.764
Quieres decírselo inmediatamente cuando empiezas

0:04:30.764,0:04:34.270
en esto se basa tu prototipo inicial.

0:04:34.270,0:04:37.300
Pero luego seguimos añadiendo más cosas al prototipo.

0:04:37.300,0:04:41.824
Porque habrá alguna cosa que es única a los "Winstons" o única a los "Hoopers"

0:04:41.824,0:04:42.953
que no tiene los "Creatures".

0:04:42.953,0:04:46.319
Y es genial que puedas definir esas cosas.

0:04:46.319,0:04:49.845
Muy bien. Ahora, si miramos esto, todavía tenemos código repetido.

0:04:49.845,0:04:51.296
El código constructor.

0:04:51.296,0:04:54.184
¿Cierto? Tenemos todo esto tres veces.

0:04:54.184,0:04:58.056
¿Podríamos simplemente borrarlo?

0:04:58.056,0:05:01.048
Tratemos.

0:05:01.048,0:05:03.670
Ok, mmm. No parece haber funcionado.

0:05:03.670,0:05:07.959
Porque nuestro "Hooper" aparece en la esquina superior izquierda, parece que olvidó todo sobre él.

0:05:07.959,0:05:16.230
Y esto es porque Javascript no asume que quieres el mismo constructor incluso si quieres basar el prototipo en él.

0:05:16.230,0:05:19.304
Ya sabes, te permite definir tu propio constructor para esos objetos.

0:05:19.304,0:05:26.019
Pero también te da una forma fácil de llamar al constructor de un objeto.

0:05:26.019,0:05:27.648
Así que la forma en que haremos esto es

0:05:27.648,0:05:36.656
escribiendo "Creature.call(this, nickname, age, x, y);"

0:05:36.656,0:05:40.780
Ahora, lo que esto hace (Nota que funcionó. Sí), lo que hizo es

0:05:40.780,0:05:44.268
que en realidad está llamando a la función "Creature", la función constructora.

0:05:44.268,0:05:50.329
Está llamando esa función pero está pasando y está diciendo: "ok, debes llamar la función constructora como

0:05:50.329,0:05:54.349
si la estuviera llamando este objeto 'Hooper'

0:05:54.349,0:05:57.004
y como si la estuviera llamando con estos argumentos".

0:05:57.004,0:05:59.498
Estos son argumentos con los que se llamó "Hooper".

0:05:59.498,0:06:03.797
Y terminará ejecutando este código como si estuviera justo aquí.

0:06:03.797,0:06:06.489
Y es exactamente lo que queremos. Y funcionó.

0:06:06.489,0:06:07.827
Y podemos continuar y

0:06:07.827,0:06:11.679
copiar esta línea en la función constructora

0:06:11.679,0:06:15.165
de "Winston" también.

0:06:15.165,0:06:17.087
Y funcionó. ¡Sí!

0:06:17.087,0:06:22.177
Muy bien. Revisemos esto. Hemos encapsulado todas nuestras propiedades compartidas y funcionalidades

0:06:22.177,0:06:24.671
en este tipo de objeto base, "Creature".

0:06:24.671,0:06:28.411
Y hemos hecho dos tipos de objeto que provienen de este tipo de objeto base.

0:06:28.411,0:06:31.397
Ellos heredan la funcionalidad pero añaden la suya propia también.

0:06:31.397,0:06:36.261
Y lo interesante de esto es que podemos cambiar la funcionalidad compartida en un sólo lugar.

0:06:36.261,0:06:41.369
Como si quisiéramos cambiar la edad de nuevo, podríamos decir más "years old" (años de edad).

0:06:41.369,0:06:44.112
Ahora todos tienen "years old" al final.

0:06:44.112,0:06:53.178
O podríamos cambiar la función "talk" y poner "SUPPP!?!?!?!?". Y ahora los "Winstons" y los "Hoopers" dirán "SUP".

0:06:53.178,0:06:56.781
Entonces, ahora has visto como crear tipos de objetos y heredar de los tipos de objetos,

0:06:56.781,0:07:01.464
puedes empezar a pensar cómo sería útil esto en tus dibujos, animaciones, simulaciones y juegos.

0:07:01.464,0:07:05.048
Por ejemplo, tal vez tienes un juego y tienes muchos tipos de personajes en él,

0:07:05.048,0:07:07.447
y todos ellos pueden correr pero sólo algunos de ellos pueden saltar.

0:07:07.447,0:07:12.073
Ese es un lugar perfecto para usar algunos tipos de objetos y algo de herencia.

0:07:12.073,0:07:15.630
Pero apuesto a que puedes pensar en muchas más formas de hacerlo.