Introducción al curso

1

¡Alto! Tenemos una nueva versión de este curso para ti

2

Bienvenidos al Curso de Fundamentos de JavaScript

3

Repositorio de este curso de fundamentos de JS

Primeros pasos en JavaScript

4

Variables

5

Variables: Strings

6

Variables: Números

7

Funciones

8

El alcance de las funciones

9

Objetos

10

Desestructurar objetos

11

Parámetros como referencia o como valor

12

Comparaciones en JavaScript

Estructuras de Control y Funciones

13

Condicionales

14

Funciones que retornan valores

15

Arrow functions

16

Estructuras repetitivas: for

17

Estructuras repetitivas: while

18

Estructuras repetitivas: do-while

19

Condicional múltiple: switch

Arrays

20

Introducción a arrays

21

Filtrar un array

22

Transformar un array

23

Reducir un array a un valor

Programación Orientada a Objetos en JavaScript

24

Cómo funcionan las clases en JavaScript

25

Modificando un prototipo

26

El contexto de las funciones: quién es this

27

La verdad oculta sobre las clases en JavaScript

28

Clases en JavaScript

Asincronismo

29

Funciones como parámetros

30

Cómo funciona el asincronismo en JavaScript

31

Cómo funciona el tiempo en JavaScript

32

¿Qué pasó con swapi.co?

33

Callbacks

34

Haciendo múltiples requests

35

Manejando el Orden y el Asincronismo en JavaScript

36

Manejo de errores con callbacks

37

Promesas

38

Promesas Encadenadas

39

Múltiples promesas en paralelo

40

Async-await: lo último en asincronismo

Juego de HTML

41

Comenzando el juego

42

Generando una secuencia de números

43

Iluminando la secuencia de colores

44

Obteniendo el input del usuario

45

Agregando la verificación del color elegido

46

Agregando los estados finales del juego

47

Conclusiones del curso

Complementos

48

Diferencias entre var, let y const

49

Memoización: ahorrando cómputo

50

¿Hace cuántos días naciste?

51

Funciones recursivas

52

Entiende los closures de JavaScript

53

Estructuras de datos inmutables

54

Cambiando de contexto al llamar a una función

55

¿Cuándo hace falta poner el punto y coma al final de la línea?

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

La verdad oculta sobre las clases en JavaScript

27/55
Recursos

Los objetos en JavaScript son “contenedores” dinámicos de propiedades. Estos objetos poseen un enlace a un objeto prototipo. Cuando intentamos acceder a la propiedad de un objeto, la propiedad no sólo se busca en el propio objeto sino también en el prototipo del objeto, en el prototipo del prototipo, y así sucesivamente hasta que se encuentre una propiedad que coincida con el nombre o se alcance el final de la cadena de prototipos.

Aportes 395

Preguntas 75

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Les dejo mi explicación de todo el rollo de esta clase con todo y un ejemplo con autos:
Los objetos en JS son como cualquier objeto en otro lenguaje de programación; sin embargo, tienen un approach algo diferente. Primero que nada, un objeto en JS sigue la nomenclatura JSON y la cual está basada en una estructura computacional llamada HashMap que permite el acceso a los datos de manera MUY rápida con solo llamar al atributo, E.g.

var diego = { name: 'Diego' }

diego.name // 'Diego'

// Esta es una de las estructuras de datos más veloces ya que puedes obtener los datos sin analizar todo el conjunto.

La cosa es que en JS, los objetos json tienen una característica que los hace especial: su padre es el objeto Prototipo u “Object.__proto __”, eso significa que “heredan” toda cantidad de características de ese prototipo mayor. Esto sucede en todos los lenguajes, siempre hay un objeto mayor del que todos heredan, en el caso de python se llama Object, en JS también, pero lo que se hereda es el atributo __proto __, por lo tanto todos son hijos de “Object.__proto __”.
Pero… la Programación Orientada a Objetos tiene características como:

  • Abstracción
  • Encapsulamiento
  • Herencia
  • Polimorfismo
    En JS no las podemos implementar? La respuesta es sí, pero hasta este punto del curso, no es tan fácil de hacerlo, en la siguiente clase estos problemas parecen ir solucionándose de manera fácil, pero por el momento, hay que entender lo fundamental: los prototipos.
<h3>¿Cómo solucionamos esto?</h3>

Primero que nada, necesitamos un constructor diferente para nuestro objeto, porque la nomenclatura json no es del todo cómoda ni bonita para programar, ni tampoco es funcional. Para lograr esas características, utilizaremos una función. Las funciones son objetos de primera-clase (según Mozilla), y si es un objeto, significa que también hereda las funciones de prototipo!! Y si es una función significa que la podemos llamar, por lo tanto es funcional.

function Automovil(color, marca) {
	this.color = color;
	this.marca = marca;
}
var fiesta = new Automovil('Blanco', 'Ford');

fiesta.color // 'Blanco'
// Igual de rápido que el JSON, porque la función también es un objeto

Entonces con una función ya tenemos un objeto como un json y con una visualización mucho más cómoda y una mayor funcionalidad. Esto no nos ha solucionado el problema; sin embargo, nos ha abierto las puertas a hacerlo.

Ahora, teniendo una función, significa que tenemos el constructor de un objeto que hereda de “Object.__proto __”, pero ¿cómo le metemos funciones a nuestro objeto? Para eso utilizamos el atributo prototype dentro del objeto. El atributo prototype es una propiedad dentro de nuestro objeto y dentro le pondremos las funciones que harán especial a ese objeto.

Automovil.prototype.abrirCajuela = function () {
	console.log('abrir atrás');
}
Automovil.prototype.pitar = function () {
	console.log('realizar pitido');
}

Aquí podemos ver que ahora el Automovil tiene la funcion abrirCajuela() y que hará las acciones para abrir atrás porque la cajuela siempre está detrás.

<h3>Herencia</h3>

Ahora sí, después de tanto rollo, podemos llegar a la herencia que es lo que importaba de la clase. Para entender esto habrá que crear un nuevo tipo de auto, e.g. Vocho.

function Vocho(color, marca) {
	this.color = color;
	this.marca = marca;
}
var herbie = new Vocho('Blanco', 'Volkswagen');

herbie.color // 'Blanco'

Excelente, pero ¿de qué me sirve si volveré a escribir todo el objeto de nuevo? aquí es donde entra la herencia. Lo que haremos será decirle al Vocho (objeto2) que herede todo del Automovil (objeto1) y así desde el objeto2 tendremos acceso a las funciones del objeto1 como abrirCajuela() y pitar(). Ya con esas funciones lo que queremos es modificar la primera porque el Vocho tiene la cajuela en frente y el motor atrás, por lo que la función abrirCajuela() nos abrirá el motor si no la cambiamos.
Para esto, usaremos el mismo hack de Sacha. Una función que dentro tenga 3 prototipos: el padre, el hijo y un prototipo que servirá como referencia al prototipo padre.

function heredaDe(hijo, padre) {
    var fn = function () {}
    fn.prototype = padre.prototype;
    hijo.prototype = new fn;
    hijo.prototype.constructor = hijo;
}

Aquí lo que estamos haciendo es decirle al hijo que su constructor (la función a la que llamamos cuando hacemos “new”) sea una instancia de todas las funciones que hay dentro del padre. En nuestro ejemplo el padre es Automovil y el hijo es el Vocho.

heredaDe(Vocho, Automovil)
// es importante que esta función la declaremos antes de crear instancias de los objetos (fiesta y herbie) y de modificar las funciones.

Hasta este punto ya tenemos las funciones abrirCajuela() y pitar() en el Vocho. Pero si le hablamos, veremos que el vocho abrirá atrás como cualquier otro auto y lo que queremos es que abra en frente. Para lograr esto, modificaremos la función abrirCajuela().

Vocho.prototype.abrirCajuela = function () {
	console.log('abrir enfrente');
}

Ahora, ya podemos crear las instancias de nuestros objetos y acceder a sus funciones.

var fiesta = new Automovil('Blanco', 'Ford');
var herbie = new Vocho('Blanco', 'Volkswagen');

fiesta.abrirCajuela(); // 'abrir enfrente'
herbie.abrirCajuela(); // 'abrir atrás'
herbie.pitar(); // 'realizar pitido'

Wow. Gracias si lo leyeron todo, espero haber ayudado en algo.

Resume de la clase:

Cómo hago para que un prototipo herede de otro?

…“JS no soporta la herencia porque no soporta las clases, no hay clases, hay prototipos a los que les vamos agregando métodos que reciben funciones, saben quien es ‘this’ y saben como ejecutarlas. Pero no existe un sistema como tal donde yo diga: _este prototipo va a heredar de otro”…

Lo que sí existe es la 'herencia prototipal’
Cómo funciona? => es posible crear prototipos ‘hijo’ que van a ser un subtipo de persona en este caso, por ejemplo un ‘desarrollador’.
Este ‘hijo’, cada vez que sea requerido buscará los métodos en sí mismo, luego si no lo encuentra, en su ‘padre’, ‘abuelo’… hasta llegar al prototipo base de todos los objetos que es ‘object’. Si ‘object’ no conoce ese mensaje, recién ahí es que javaScript lanzará el error de que ese método no puede ejecutarse.

HERENCIA ENTRE CLASES JavaScript

(Hay que cogerla suave para entender todo esto, así que vamos por partes)

  • Lo primero que tenemos que entender es que en Js no existen como tal las clases,
    lo que si existe son prototipos.
    Entendemos por prototipo a una función creadora, la cual acepta parámetros que definirán las características de un objeto
function Jugador(nickname,score){
    this.nickname = nickname
    this.score = score
}
  • Ahora si empecemos ! : Sabemos que tenemos un prototipo llamado Jugador al cual vamos a utilizar para crear un nuevo objeto
var jugador1 = new Jugador('ninjaJs',355)
  • Una vez creado nuestro objeto necesitamos agregar algún método a este. Un método no es más que otra función que interactua con las caracteristicas de nuestro objeto
Jugador.prototype.saludar = function (){
    console.log(`soy ${this.nickname} y soy un Jugador normal`)
}

El nombre del método será saludar y utilizará los paramertos definidos en el prototipo Jugador

  • ATRIBUTO .prototype : es un atributo con el cuentan todas las funciones que indica que métodos y parametros entiende

  • Ahora bien ¿Qué y si queremos crear otro prototipo llamado JugadorExperto que herede los parametros de Jugador (nuestro prototipo padre) ?

  • HERENCIA PROTOTIPAL : en este caso JugadorExperto será un subtipo del prototipo Jugador que necesita heredar sus métodos y parametros

  • Para ello necesitamos crear una función global que sea capaz de cambiar la Herencia que tiene JugadorExperto por defecto. Entendamos la manera difícil de hacer esto para entenderlo por completo

  1. creamos la función que aceptará por parametro el prototipo/subtipo o (protoripoHijo) y el prototipo/original o (prototipoPadre)
function heredarDe(prototipoHijo, prototipoPadre){}
  1. dentro de nuestra función de cambio de Herencia creamos una dummy function (función que no hace nada) e indicamos que su atributo .prototype apunte al .prototype del prototipoPadre
function heredarDe(prototipoHijo, prototipoPadre){
    var noop = function (){}
    noop.prototype = prototipoPadre.prototype
}
  1. Ahora apuntamos el atributo .prototype del subtipo protipoHijo a un nuevo objeto creado por el prototipo de la dummy Function. por ultimo apuntamos el atributo .constructor al subtipo prototipoHijo
function heredarDe(prototipoHijo, prototipoPadre){
    var noop = function (){}
    noop.prototype = prototipoPadre.prototype
    prototipoHijo.prototype = new noop;
    prototipoHijo.prototype.constructor = prototipoHijo
}
  • Y listo ! ya tenemos nuestra función para cambiar la herencia prototipal, lo unico que resta es invocarla justo antes de que queramos cambiar la herencia, para ello y volviendo a nuestro ejemplo:
  1. invocaremos heredaDe() para heredar los métodos y parametros de Jugador en JugadorExperto

heredaDe(JugadorExperto,Jugador);


function JugadorExperto(nombre, score){
    this.nombre = nombre
    this.score = score
}
  1. utilizar método de prototipo padre y modificarlo, lo cuál creará un método en el subtipo que se llame exactamente igual al método original del prototipoPadre pero con las modificaciones sobrescritas o pisadas
JugadorExperto.prototype.jugar = function(){
    console.log(`Soy ${this.nombre} y soy un Jugador Experto`)
}

Si alguien llega a leer hasta aquí y entiende un poco más, me sentiré muy contento 😄

Veo que la mayoría tiene problemas con esta clase. Existen muchas formas para tratar de explicarlo. Según la investigación que llevé a cabo, estas son mis notas y espero que a más de uno logre entender esto.

// La herencia en ES5 era cosa de locos, por tal motivo ES6 trae consigo un wrapper para trabajar orientado a objetos como en otros lenguajes de programación...
// Ejemplo de herencia prototipal en ES5


// Declaración de la clase padre
function Persona(nombre, apellidos, altura) {
    this.nombre = nombre
    this.apellidos = apellidos
    this.altura = altura
}

Persona.prototype.saludar = function() {
    console.log(`Hola, mi nombre es ${this.nombre} ${this.apellidos}`)
}

Persona.prototype.consultarAltura = function()  {
    console.log(`${this.nombre} tiene una estatura de ${this.altura} mts.`)
}



// Declaración de la clase hija
function Desarrollador(nombre, apellidos, altura, lenguajes) {
    // 3. El constructor crea una nueva propiedad llamada super para este objeto, y le asigna como valor el constructor de la clase de la cual se quiere extender, Persona.
    this.super = Persona
    // 4. La declaración anterior convierte el atributo super, en un metodo (vinculo) para invocar al constructor de la clase padre y pasarle todos los parametros que necesita para ser inicializado. La palabra super es solo por convención
    // Durante todo este proceso, this hace referencia a este objeto....
    this.super(nombre, apellidos, altura)
    this.lenguajes = lenguajes
}

// 5. Indicamos que el prototipo base para Desarrollador, es el prototipo Persona (es decir, indicamos de quien extiende o hereda)
Desarrollador.prototype = new Persona

// Sobre-escribir metodos del prototipo padre
Desarrollador.prototype.saludar = function() {
    console.warn(`Desarrollador ${this.nombre} ${this.apellidos}`)
}
// Añadir los metodos propios de la clase hija
Desarrollador.prototype.mostrarLenguajes = function() {
    console.log(`${this.nombre} domina las siguientes tecnologías: ${this.lenguajes.join(', ')}`)
}



var genaro = new Persona('Genaro', 'Tlacoyo Fuentes', 1.89)

// 1. El operador new creará un objeto generico y le asignara a la propiedad _proto el valor de Desarrollador.prototype
// 2. El operador new pasará el nuevo objeto creado al constructor de Desarrollador, como valor de la palabra reservada this. (este objeto) 
var alejandro = new Desarrollador('Alejandro', 'González Reyes', 1.72, ['php','css','html','js','mysql','laravel','vuejs'])

console.log(genaro)
console.log(alejandro)

genaro.saludar()
alejandro.saludar()

genaro.consultarAltura()
alejandro.consultarAltura()

alejandro.mostrarLenguajes()


/**
 * Apuntes finales.
 * 
 * La búsqueda de propiedades en JavaScript comienza en las propias propiedades del objeto, y si este nombre de propiedad no se encuentra, consulta las propiedades del objeto especial __proto__. Este proceso se realiza de manera recursiva.
 * 
 * La propiedad especial __proto__ se define cuando un objeto es construido: su valor corresponde con la propiedad prototype del constructor. Así, la expresión new Foo() crea un objeto con la propiedad __proto__ == Foo.prototype. En consecuencia, los cambios producidos en Foo.prototype alteran la búsqueda de propiedades de todos los objetos creados con new Foo().
 * 
 * Todo objeto tiene una propiedad __proto__, así como una propiedad prototype. Por lo tanto, los objetos pueden relacionarse a través de esta propiedad.
 * 
 * genaro._proto_ = Desarrollador.prototype;
 * genaro._proto_._proto_ = Persona.prototype;
 * genaro._proto_._proto_._proto_ = Object.prototype;
 * genaro._proto_._proto_._proto_._proto_ = null;
 */

Estuve leyendo este articulo, no se si el curso se quedo anticuado y ya mejoraron la forma de manejar las clases.

Hice las pruebas y funciona de maravilla, es mas fácil que el prototipado.

class Animal{
    constructor(nombre){
        this.nombre = nombre
    }
    hablar(){
        console.log(this.nombre +' hace ruido')
    }
}

class Perro extends Animal{
    hablar(){
        console.log(this.nombre + ' ladra!')
    }
}

Adjunto el código de la clase:


function heredaDe(prototipoHijo, prototipoPadre) {
	var foo = function(){}
	foo.prototype = prototipoPadre.prototype
	prototipoHijo.prototype = new foo
	prototipoHijo.prototype.constructor = prototipoHijo
}

function Persona(nombre, apellido, altura, genero){
	this.nombre = nombre
	this.apellido = apellido
	this.altura = altura
	this.genero = genero
}

Persona.prototype.saludar = function(){
	console.log(`Hola me llamo ${this.nombre} ${this.apellido}`)
}

Persona.prototype.soyAltX = function(){
	var altX = this.genero == 'masculino' ? 'alto' : 'alta'
	var string = this.altura >= 1.8 ? `Soy ${this.nombre} ${this.apellido} y definitivamente soy ${altX}.` 
									: `Soy ${this.nombre} ${this.apellido} y no, no soy ${altX}.`
	console.log(string)
}

function Desarrollador(nombre, apellido){
	this.nombre = nombre
	this.apellido = apellido
}
heredaDe(Desarrollador, Persona)

Desarrollador.prototype.saludar = function(){
	console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy desarrollader.`)
}

" un desarrollador es un subtipo de persona " la verdad se ha dicho

Bueno, después de ver el vídeo 4 veces y leerme unas cuantas páginas de información adicional, creo que he entendido lo básica. Es una clase compleja, pero que nos muestra un poco sobre cómo está construido javascript. No nos desanimemos, compañeros!

Una aclaración del final del video: Aunque Desarrollador hereda los métodos de Persona, el método soyAlto() aunque se hereda no funciona correctamente ya que los métodos constructor de los prototipos son distintos y el prototipo de Desarrollador no tiene el atributo altura.

Bueno quizá este es el tema mas complejo hasta este punto del curso. Acá dejo mi resumen de lo que he entendido e investigado de este tema (de un novato para novatos):

  1. Debemos entender primero que es un prototipo. Lo podemos ver como un “formulario” que usaremos para llenar rápidamente la información (atributos) y funcionalidades (métodos) que le corresponden a un objeto. Acá tenemos dos objetos con dos prototipos propios (ósea formularios).
  2. Por favor usen la palabra “formulario” solo como una referencia para entender el funcionamiento de un prototipo, no es una definición muy acertada pero tampoco dista demasiado de lo que termina ejecutando.
  3. Bien esta estructuración de formularios es propia de todas las funciones. Ósea todas las funciones tienen un prototipo y lo podemos copiar entre funciones.
  4. Ahora teniendo eso en mente, hay “formularios” que pueden contener información general de un objeto que los tomaremos como el prototipo Padre. A medida que creamos nuevos objetos mas especializados notamos que estos tienen información (atributos) y funciones (métodos) similares a un objeto padre y claro está su propia información (atributos) y funciones (métodos). Para ahorrar tiempos es más fácil si copiamos estos atributos y métodos a nuestro nuevo objeto. Este es el concepto de herencia en JS.
  5. JS no posee el concepto de clases como tal así que el proceso de herencia no se hace tan directo como en otros lenguajes. Acá lo que debemos hacer es una copia de los métodos de la clase padre, haciendo uso de la palabra prototype.
  6. Otro detalle de esta copia, esta no queda directamente en nuestro objeto hijo. Lo que se hace es anidar nuestro objeto, es como si metiéramos nuestro nuevo objeto hijo dentro del padre, es como abrir una muñeca rusa desde adentro. Cuando no encontramos respuesta a nuestra pregunta dentro de nuestra muñeca (objeto hijo), abrimos la tapa y miramos en la muñeca que esta sobre nosotros (padre), así sucesivamente (padre del padre, etc) hasta que obtenemos o no una respuesta.
  1. Y mas detalles, en este momento al copiar el prototype solo se copian los métodos (funciones). Es un quebradero de cabeza intentar hacer que un objeto Desarrollador ejecute el método soyAlto() y nos de un resultado deseado. Si revisas si el atributo altura está dentro de nuestro objeto Desarrollador veras un undefine. Aún si lo has pasado como atributo del objeto.
var arturo = new Desarrollador('Arturo', 'Martinez', 1.89)
arturo.altura
undefined
  1. Esto se debe a que el atributo altura no lo hereda directamente de Persona, hay dos soluciones una al nivel de lo visto hasta este momento y es agregar al prototipo Desarrollador el atributo altura.
function Desarrollador(nombre, apellido, altura) {
    this.nombre = nombre
    this.apellido = apellido
    this.altura = altura
}
  1. La otra opción, es hacer que Desarrollador herede de Persona sus atributos para esto usamos la palabra clave padre.call(this, atributos). Me estoy saltando algunas clases, pero mi intención es mostrar que en realidad es posible heredar los atributos desde el objeto padre.
function Desarrollador(nombre, apellido,altura) {
    Persona.call(this,nombre, apellido,altura);
}
  1. Ahora procedo a analizar el proceso de herencia de nuestras funciones Persona (Padre) a Desarrollador (Hijo). Lo primero es construir una función que al ser invocada envié Persona e Hijo para hacer este proceso.
heredaDe(Desarrollador, Persona)
function heredaDe(prototipoHijo, prototipoPadre) {
    
}
  1. Como lo mencione todas las funciones tienen como estructura un prototipo, si definimos una función vacía será como tener una hoja de un formulario limpia. Aprovechando estas características usaremos una función vacía fn como auxiliar. En ella podemos copiar el prototipo de mi clase padre. En esta copia fn tendremos todas las funciones de Persona: saludar y soyAlto.
function heredaDe(prototipoHijo, prototipoPadre) {
    var fn = function () {}
    fn.prototype = prototipoPadre.prototype 
}
  1. Procedamos a “anidar” nuestro objeto Desarrollador (hijo) dentro de Persona (Padre). Para esto instanciamos dentro de nuestro prototipo Desarrollador el prototipo de fn que es una copia de Persona.
function heredaDe(prototipoHijo, prototipoPadre) {
    var fn = function () {}
    fn.prototype = prototipoPadre.prototype
    prototipoHijo.prototype = new fn
}
  1. En este punto ya tenemos anidados los prototipos de nuestros dos objetos (Persona y Desarrollador). Si me he explicado bien has entendido que toda la información del prototipo persona (formulario de persona) se ha copiado en Desarrollador.
  2. Pero es necesario hacer un ultimo paso, y es indicar cual de los dos prototipos será con el que se inicie nuestros objetos Desarrollador, si el que acabamos de copiar o el que definimos para Desarrollador. En este punto iniciaríamos con el de Persona, pero esto no es lo que deseamos. Seria tirar las líneas de código de nuestro prototipo Desarrollador a la basura. Así que le indicamos a JS que deseamos iniciar nuestro objeto con el prototipo de Desarrollador. Esta es la ultima línea de código que agregamos.
function heredaDe(prototipoHijo, prototipoPadre) {
    var fn = function () {}
    fn.prototype = prototipoPadre.prototype
    prototipoHijo.prototype = new fn
    prototipoHijo.prototype.constructor = prototipoHijo
}

  1. Esta es la manera antigua de hacer este proceso. En este momento tenemos mas fáciles y directas de cumplir con este proceso. Pero en el fondo hacemos lo mismo. Es por esto importante que entiendas lo que se ha desarrollado en esta clase.

Me paso en esta sección de POO en Js que no comprendía los conceptos y por ende estaba solo copiando lo que hacia el profe.
Si a alguien mas le pasó, le recomiendo tomar el curso de Programación orientada a objetos, me despejó todas las dudas y ahora entiendo todo 😃

🤯

ok me falto agregarle las fotos de la consola debido a que esta las necesita si o si (clases anteriores ya cuentan con las fotos de la consola) por lo que la explicación de esa parte estará en el archivo doc con sus respectivas imágenes y lo compartiré al final del curso, esto la verdad es mucho mas sencillo de lo que parece la verdad al menos yo lo entendí de esta manera.

LA VERDAD OCULTA SOBRE LA CLASES EN JAVASCRIPT

Otros lenguajes de programación soportan la herencia entre clases, y tal vez te estes preguntando si Javascript posee es te soporte de herencia, como hacer para que un prototipo herede de otro.
Javascript como tal no soporta la herencia porque no soporta las clases, las clases en javascript no existen, lo que si existe es la herencia prototipal.
Siendo asi, como ya creamos prototipos, vamos a crear prototipos “hijos” que vendrían siendo subtipos, lo que vamos a hacer es que vamos a ver si nuestro subtipo sabe responder al método en el cual lo vamos a llamar, si no sabe responder al método, va a buscar en el prototipo padre a ver si lo encuentra, si no lo encuentra va a seguir esa cadena de buscar en el prototipo padre, luego en el de arriba y asi, hasta llegar al prototipo base de todos los objetos que es “object” si object no conoce ese mensaje allí es que javascript lanzara el error de que no se puede ejecutar ese método.
Esto lo explicaremos de la siguiente manera, primero que todo, seguiremos con el código de la clase pasada, porque crearemos este “prototipoHijo” y le agregaremos ciertas cosas que harán que esta comunicación prototipal funcione, también recalco con esto que esto solia usarse antes, hoy en dia existe un método aun mas sencillo de hacer esto, pero igual debes aprender este método, es complicado pero aca se detallara.
Bien primero lo primero, vamos a crear el prototipo Desarrollador y haremos los objetos creados nos saluden y nos digan que son desarrolladores;

function Desarrollador(nombre, apellido) {
    this.nombre = nombre
    this.apellido = apellido

}

Desarrollador.prototype.saludar = function (){
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy desarrollador`)
}

Bien esto no tiene mucha explicación, básicamente hemos hecho lo mismo que en clases anteriores, crear un constructor y crear una función para este que utilice los objetos creados con este constructor.
Luego de esto viene la parte interesante, vamos a crear la funcion “heredaDe” que para simplificar la explicacion, esto lo que hará en palabras resumidas es ser un puente entre el protipo hijo y el prototipo padre;

function heredaDe(PrototipoHijo, PrototipoPadre){
    var fn = function () {}
    fn.prototype = PrototipoPadre.prototype
    PrototipoHijo.prototype = new fn
    PrototipoHijo.prototype.constructor = PrototipoHijo
}

Esto la verdad, se puede ver como algo complejo, pero la verdad es que no lo es tanto, así que vamos a desglosarlo, primero que nada creamos la función y al ponerle los parámetros indicamos de esa manera que los mismos son “(PrototipoHijo, PrototipoPadre)” luego de esto podemos ver que existe una funcion vacia, esto siempre ira al momento de crear este puente y casi siempre tendrá este nombre o también puede denominarse “noop”(no operational), mas abajo le asignamos a la funcion “fn.prototype” y creamos la base de la conexión prototipal “PrototipoPadre.prototype”, debajo de esto podemos observar “PrototipoHijo.prototype. = new fn” esto es para hacer que nos pase un nuevo objeto sin que pise el object anterior y por ultimo “PrototipoHijo.prototype.constructor = PrototipoHijo” esto es para asignar la funcion constructora del prototipo padre, debido a que si no se agrega esta línea se llama por defecto a l a funcion constructora del prototipo padre .
Ya explicado esto pasamos a llamar la función y de qué manera la vamos a llamar;

Primero que nada, vamos a llamar la función de la siguiente manera:

heredaDe(Desarrollador, persona)

Como podemos observar al llamar la funcion “heredaDe()” como ya sabemos podemos asignarle los parámetros que necesitemos en funcion a nuestro código, en este caso, le indicaremos en sus parámetros por orden cual es el prototipo hijo y el prototipo padre, de manera que concuerde con los parámetro asignados según el orden al crear la función que será nuestro puente entre los prototipos.

Un detalle muy importante a tener en cuenta es que al llamar la funcion de herencia, debemos colocarla justo debajo de las funciones de desarrollador en este caso, de la siguiente manera:

function heredaDe(PrototipoHijo, PrototipoPadre){
    var fn = function () {}
    fn.prototype = PrototipoPadre.prototype
    PrototipoHijo.prototype = new fn
    PrototipoHijo.prototype.constructor = PrototipoHijo
}

function persona(nombre,apellido,altura) {
 this.nombre = nombre
 this.apellido = apellido
 this.altura = altura
 return this
}

persona.prototype.saludar = function() {
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido}`)
}

persona.prototype.soyAlto = function (){
    return this.altura >= 1.80
}

function Desarrollador(nombre, apellido) {
    this.nombre = nombre
    this.apellido = apellido

}
heredaDe(Desarrollador, persona)

Desarrollador.prototype.saludar = function (){
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy desarrollador`)
}

¿Por qué? Esto es debido al hecho de que, si llamamos la función justo debajo de la función “saludar” de desarrollador, que ya de por si está pisando la función “saludar” de persona, esto causaría que la función saludar se vuelva a pisar con el saludar de persona. por lo que no podríamos llamar la función saludar de desarrollador, recuerden que los prototipos deben tener cierto orden como lo vimos en clases pasadas.

Creo que el instructor esta cometiendo el error de complicar innecesariamente las clases. Se debería explicar primeramente en que consiste una herencia simple como lo hizo nuestro compañero en uno de los aportes y en cursos avanzados explicar lo que se desarrolló en esta clase o dejarla para una siguiente.

Hola! Buenos días, llevo poco tiempo suscrito en platzi y me gustaría aportar un dato que a mi parecer es importante.
Es cierto que durante mucho tiempo JavaScript no permitía el uso de clases, la herencia como tal y demás utilidades propias de un lenguaje orientado a objetos, pero desde hace unos años con las últimas actualizaciones de EcmaScript, sí que se puede hacer un uso de clases, facilitando la tarea a la hora de programar. Aquí dejo un ejemplo de lo que hablo siguiendo el ejemplo que has puesto:

            class persona{
                constructor(nombre,apellidos,altura){
                    this.nombre = nombre;
                    this.apellidos = apellidos;
                    this.altura = altura;
                }
                saludar(){
                    console.log(`Hola, me llamo ${this.nombre} ${this.apellidos} y mido ${this.altura}`);
                }
                soyAlto(){
                    return this.altura>1.8;
                }
            }
            class desarrollador extends persona{
                constructor(nombre,apellidos,altura,edad){
                    super(nombre,apellidos,altura);
                    this.edad = edad;
                }
                saludar(){
                    console.log(`Hola, me llamo ${this.nombre} ${this.apellidos} soy desarrollador y tengo ${this.edad} años`);
                }
            }
            var p1 = new persona('Juan','Gutierrez',1.71);
            p1.saludar();
            /*Ejemplo de herencia, la clase desarrollador hereda de la clase persona.*/
            var d = new desarrollador('Pepe','Fernandez', 1.81, 23);
            d.saludar();
            console.log(d.soyAlto());//Puedo hacer uso de sus funciones.

A mi parecer es más sencillo de esta manera, pues es similar a otros lenguajes de programación.

** La verdad oculta sobre las clases en JavaScript**

Los objetos en JavaScript son “contenedores” dinámicos de propiedades. Estos objetos poseen un enlace a un objeto prototipo. Cuando intentamos acceder a la propiedad de un objeto, la propiedad no sólo se busca en el propio objeto sino también en el prototipo del objeto, en el prototipo del prototipo, y así sucesivamente hasta que se encuentre una propiedad que coincida con el nombre o se alcance el final de la cadena de prototipos.
.
javascript no soporta la herencia por que en realidad javascript no tiene clases tiene prototipos a los que les vamos agregando metodos que reciben funciones y saben quien es this saben como ejecutarlas lo que en realidad si existe es la herencia prototifal

Me da la impresión que son clases más improvisadas que planeadas, estaría bien que si cometen errores graben de nuevo los vídeos y organicen mejor la forma de explicarlo, parece que improvisa lo que va a explicar en el momento

Un poco complicado al inicio, pero la mejor explicación de la herencia de prototipos está en el último minuto.

La explicacion es muy clara, pero falto ser mas acertivo a la hora de crear el metodo HeredaDe

Parece un juego de palabras pero si no olvidas a que me refiero con la palabra constructor y que significan los parámetros prototipoHijo y prototipoPadre todo saldra bien. Los conceptos son vitales.

No Te lo resumo así nomás…

Las funciones Persona y Desarrollador son Constructores, ellos crean (construyen) los objetos sacha y a arturo.

La función heredaDe usa a los constructores Desarrollador (prototipoHijo) y Persona (prototipoPadre).

La función “vacia”, expresada como fn va a tomar todo lo que hay dentro de Persona.prototype , es decir que copiará a prototype.saludar, prototype.soyAlto y algo mas identificado como prototype.constructor, el cual contiene los detalles de la función persona). Eso es lo que ocurre cuando escribe fn.prototype = prototipoPadre.prototype.

En la linea donde esta prototipoHijo.prototype = new fn se crea un nuevo objeto usando como constructor a fn y se le asigna al prototype de prototipoHijo (Desarrollador). Como fn había tomado todos los prototype de prototipoPadre (Persona), Desarrollador va a heredar a prototype.saludar , a prototype.soyAlto y al no explicado prototype.constructor.

En la linea donde esta prototipoHijo.prototype.constructor = prototipoHijo, el prototipoHijo se puso recaliente, imaginate le quitaron a su constructor pero lo esta recuperando porque cuando se heredo todo lo de prototype del prototipoPadre (Persona), se reemplazo el constructor Desarrollador del prototipoHijo (Desarrollador). Ahora el prototipoHijo tiene su constructor de vuelta y también se queda con prototype.saludar y prototype.soyAlto.

No te vayas sin pegarle una me gusteada a la publicación y anda hacele caso a mi tia Marta.

Yo ya hace 3 videos que no entendí muy bien casi nada, ando perdido, voy a verlo todo desde el principio…

Me estaba preguntando por qué arturo teniendo una altura de 1.89 le dice que false y veo que en ningún momento se hereda el constructor de persona pensé que al faltar la altura en el prototipo desarrollador y mandarle el parámetro iba a ir a buscarlo en el elemento padre pero no fue así. en conclusión no se hereda las propiedades pero si sus métodos, para que funcione la función soyAlto tenes que establecer le la altura al desarrollador.
De pronto se este realizando un paso mal al heredar las propiedades o tal vez por que es un prototipo y no una clase no se jajaja, seria bueno que alguien nos ilustrara

yo se programar en un par de lenguajes, pero JS si que me enreda la cabeza, es el que mas se me esta complicando aprender…a alguien mas le pasa?

Esta clase me exploto la cabezaaaaaaaaaaaaaa

Clases enredadas y complejas y esta 😒

No entendí nada 😐

hay un detalle que no se marca en esta clase, y es que si la funcion que estamos heredando tiene una variable, ${this.altura} en este caso, la misma no se hereda y marca undefined al tratar de llamarla, como era una tarea la resolvi con otro codigo y logie en consola un mensaje y me marca ese undefined, al profe le marca todo en orden porque utilizo un booleano, a tener en cuenta.

Sigo sin entender porque en JavaScript enredan tanto las cosas 😦

Repeti el video mas de una vez… Y creo que con eso queda claro. Buena clase (:

En la función heredarDe creamos un objeto función “vacio” llamado fn para luego pasarle el prototipo del objeto padre:

fn.prototype = prototipoPadre.prototype;

Luego se le asigna al prototipo hijo el prototype de fn usando un new, por lo tanto se le estaría asignando un objeto:

prototipoHijo.prototype = new fn;

Mi pregunta es: No seria mas fácil en vez de crear un objeto nuevo simplemente asignarle al prototipoHijo un nuevo prototipoPadre?

Ejemplo:

prototipoHijo.prototype = new prototipoPadre;

Lo he probado yo mismo y funciona igual que en el ejemplo dado por el profesor Sacha, si alguien pudiera decirme la razón de hacerlo de la forma explicada y no de esta se lo agradecería.

Se me acaba de estallar el cerebro!!

En resumen, en js por defecto no esiste herencia entre funciones para esto se debe asignar la herencia de una función(Padre) a otra función(hija), de esta forma la **hija **hereda los prototipos de la función padre. HERENCIA PROTOTIPAL.

En esta clase, si quedé gringo.Cuando o en que casos se usa la herencia protipada?.Recomiendo que en las diferentes lecciones se mencionen casos prácticos en los que se utilizan los diferentes elementos que hemos venido estudiando.Como apenas empiezo en el mundo de la programación, puedo ser atrevido al indicar que muchos ejemplos no les encuentro una utilidad en la práctica, toda vez que lo mismo que hace el código, lo puedo hacer vía un excel, por ejemplo.

Creo que hasta que no analiza las funciones en el último minuto no se ve lo que realmente hace la herencia. Sin embargo, me parece muy buena la explicación, aunque creo que definitivamente se debe pausar, buscar y leer los conceptos para comprender esto.

esta clase no la entendi 😦

En el minuto 12:25 se intentó ver si arturo funcionaba con el método soyAlto. Pero esto no funcionó porque arturo mide 1.89 pero ahí en el video sale que arturo.soyAlto() es false.
Si yo hago el mismo procedimiento que Sacha nos muestra y luego en el console escribo arturo.altura me dice que es undefined.
Alguien sabe como solucionar esto?

Lo que no me queda claro es como puedo heredar no sólo los métodos, si no también los atributos del prototipo, ya que al querer acceder a ‘desarrollador.altura’ y utilizar la función “soyAlto” este sigue siendo undefined y por lo tanto obtengo un false a pesar de que al inicializar el objeto se especifico en su declaración.

Lo que no entendí muy bien es para que sive, desde los arrays nos estamos metiendo muy complejo, pero parace todo igual, objetos… seria interesante salirnos del ejemplo original, de personas, hacer algo muy diferente desde 0, para entender para que sirven por ejemplo las herencias… que no lo entiendo. Y ojo este curso me esta encantando y al profesor un 10.

Que clase brutal ufff.

Recomiendo ir a la par con el vídeo, e ir pausando cada vez que no entiendan algo y repetirlo hasta entenderlo. Me fue difícil pero lo logré.

El Objeto Desarrollador solo tiene los atributos: nombre y apellido y los “metodos” saludar y soyAlto (pues puede llegar a éste gracias a la herencia prototipal), pero no tiene el atributo altura aunque se lo pase como parametro.
¿Esto quiere decir que la herencia prototipal solo sirve para heredar “metodos” y no sirve para heredar atributos del Prototipo Padre?

En JavaScript no hay clases sino prototipos
Los Prototipos son objetos
El atributo “prototype” lo tienen todas las funciones y es un objeto que brinda toda su información: métodos, constructor, etc

El atributo proto: apunta al prototipo que tiene el objeto, si es object termina la cadena.

Al realizar la herencia se agregan métodos y se modifica el constructor

Me preocupa cuando comenzamos a ver mucho contenido, y micro retos, pero que al final no nos ponen del todo en contexto de su uso en un proyecto real. No sé si más adelante aparezcan, pero de algún modo no logro medir si lo estoy teniendo claro, este tema me ha parecido enrredado.

solo hago lo que dice, y los ejercicios me salen , pero no entiendo nada , deberia haber algo donde aplicarlo durante el curso no? por ahora solo estoy aprendiendo de memoria

Un tema muy complicado de entender, aunque leyendo los comentarios me alegra ver que no soy el único al que se le dificulta 😄

Es muy complejo jajaja muchos prototype!.

Wow siento que a veces Sacha no se sabe explicar muy bien o nos explica como si ya supieramos a su nivel.

Tambien cuando dijo Padre no pude dejar de pensar en el video de “Soy tu padre” con su acento argentino xD sorry

Recuerdo cuando en en programación básica Freddy dijo que nunca tendríamos que meternos con prototype…

Se puso difícil de golpe.

no ENTENDÍ nada. Aparecen conceptos si ser explicados. O yo estoy fuera de foco o faltó un poco más de explicación.

Naguara no entendí nada XD , Esta muy compleja esta clase.

La clase más dura de mi vida… MI MADREEEEE…!
Al siguiente capítulo.

Ya se puede utilizar el sintax sugar Extends para la herencia de clases. Aquí hay muy buenos ejemplos desde lo más simple hasta lo más complejo como lo vimos en esta clase.
link:
http://javascript.info/class-inheritance

class Persona {
  constructor(nombre, apellido, altura) {
    this.nombre = nombre
    this.apellido = apellido
    this.altura = altura
  }
  saludar() {
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido}`)
  }
  soyAlto() {
    return this.altura > 1.8
  }
}

class Desarrollador extends Persona {
  saludo() {
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy desarrollador/a`)
  }
}

Rayos, me moveré a la siguiente lección para ver si entiendo un poco más sobre esto

una clase muy compleja

Para que funcione .soyAlto() en arturo, debemos agregar el atributo altura.

function Desarrollador (nombre, apellido, altura) {
  this.nombre = nombre
  this.apellido = apellido
  this.altura = altura
}

Puede servir como ayuda pero después de ver el video.


function heritage(childProto,fatherProto){
  let fn = function(){}; // se crea una estructura de función en el alias fn.
  fn.prototype = fatherProto.prototype; // se copia el prototipo de la función padre al hijo.
  childProto.prototype = new fn; // se crea una instancia de fn (que sería una copia de la función padre)
  childProto.prototype.constuctor = childProto; // se indica que arranque con el constructor de la función hijo y no el de la padre.
};

// Se crea el prototype padre.
function Person (name , lastName, height){
  this.name     = name;
  this.lastName = lastName;
  this.height   = height;
};

Person.prototype.greet = function(){
  return this.msg(`Hola mi nombre es ${this.name}`);
};

Person.prototype.msg = function (msg){
  console.log(msg);
};

Person.prototype.tall = function (){
  
  if(this.height >= 1.8){
    return this.msg(`Mides ${this.height} mts, eres alto`);
  }else{
    return this.msg(`Mides ${this.height} mts, no eres alto`);
  }
};

// Se crea el prototype hijo.
function Develop (name, lastName,height){
  this.name = name;
  this.lastName = lastName;
  this.height = height;
};

heritage(Develop,Person); // herencia, se pasa el prototype de la función Person a la función Develop 

// se pisa un método de la funcion padre. por eso va despues de la herencia. 
Develop.prototype.greet = function(){
  return this.msg(`Hola mi nombre es ${this.name} y soy desarrollador javaScript`);
};

// Prototype original
const aldo = new Person('Aldo','Fabro',1.70);
aldo.greet(); // Hola mi nombre es Aldo
aldo.tall();  // Mides 1.7 mts, no eres alto

// Prototype heredado( Develop ), puede hacer uso de los métodos del prototype padre( Person ).
const dev = new Develop('Aldo','Fabro',190);
dev.greet(); // Hola mi nombre es Aldo y soy desarrollador javaScript
dev.tall(); // Mides 190 mts, eres alto

Me perdí

esta clase fue un poco compleja...

Spoiler alert! Mira esta clase, después ve a la siguiente, después regresa a esta clase y asi es mas “sencillo” entender esta clase.

Todas las funciones tienen el atributo prototype y prototype a la vez es
un objeto que nos dice que métodos tiene la función, que atributos tiene y cual es su constructor.

Creo que debería haber explicado primero que es la herencia y para qué la vamos a utilizar porque como dijo Sacha: “Si conoces algún otro lenguaje de programación qué soporte la herencia…”

ese es el problema… yo no se programar en otros lenguajes todavía el primer y último curso que tomé en platzi hasta ahora fue el de programación básica

Una duda, casi al final del video cuando Sasha hace Desarrollador.prototype y llama a arturo.soyAlto() le da respuesta false pero Arturo mide 1.85 por lo que debería ser false, no?

function hereredaDe(prototipoHijo,prototipoPadre) {
  var fn = function () {}
  fn.prototype = prototipoPadre.prototype
  prototipoHijo.prototype = new fn
  prototipoHijo.prototype.constructor = prototipoHijo
}

function Persona(nombre,apellido,altura) {
  this.nombre = nombre
  this.apellido = apellido
  this.altura = altura
}

Persona.prototype.saludar = function (){
  console.log(`Hola me llamo ${this.nombre} ${this.apellido}`)
}

Persona.prototype.soyAlto =  function(){
  return this.altura>1.8
}

function Desarrollador(nombre,apellido) {
  this.nombre = nombre
  this.apellido = apellido
}

hereredaDe(Desarrollador,Persona)

Desarrollador.prototype.saludar = function(){
  console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy Desarrollador/a.`)
}


var fernando = new Persona('Fernando','Huaman',1.72)
var erika = new Persona ('Erika','Luna',1.65)
var arturo = new Persona ('Arturo','Martinez',1.89)```

Que clase tan excelente, la forma de explicar de sacha hace que captemos el 100% de la información.

muy buena clase, me tarde un poquito en entender bien, pero al fin lo comprendí 😃 comparto mis notas

Me dolio un poquito la cabeza jejejeje pero esta buenisima la clase!

Esta clase se me hizo compleja.

Debería esforzarme en entenderla? O basta con conocer la siguiente clase?

/*No existe la herencia como tal en JS, si podemos aplicar una herencia prototipal.
todos los prototipos son hijos del prototipo object, por lo que si nosotros creamos un prototipo que no reconoce
un metodo o atributo, va a ir a buscar a su prototipo padre o superior, y asi hasta que encuentre o no 
lo que le pedimos.*/

//esta es la funcion para crear un prototipo de clase persona
function persona(nombre, apellido, altura) {
    //this hace referencia al atributo que se creara en el momento de llamar a la funcion, y le paso como valor lo que recibo como parametro
    //propiedades    
    this.nombre = nombre;
    this.apellido = apellido;
    this.altura = altura;
    //metodo saludar
    this.saludar = function() {console.log(`Hola! soy ${this.nombre} ${this.apellido}`)}
    
}
//añadimos un metodo mas al objeto mediante prototype
persona.prototype.esAlto = function() {
   
    if (VALIDARALTURA(this)) {
        console.log(`${this.nombre} es alto`);

    } else {
        console.log(`${this.nombre} NO es alto`);
    }
}
//definimos la constante de altura para comparar
const ALTURA = 1.8;
//definimos la funcion de validacion para la altura
const VALIDARALTURA = persona => persona.altura > 1.8;
//creamos las personas
var cristian = new persona("Cristian","Bonomo",1.7);
var julian = new persona("Julian","Perez",1.9);
//llamamos al metodo


//vamos a crear un nuevo subtipo de persona, un desarrollador

function heredaDe(prototipoHijo, prototipoPadre) {
    //creamos una funcion vacia, para luego asignarle el valor de prototipo del padre
var fn = function(){};
fn.prototype = prototipoPadre.prototype;
//asignamos al hijo el prototipo de la fn vacia (que antes le asignamos el valor de prototype del padre)
prototipoHijo.prototype = new fn;
//asignamos al prototipo hijo el constructor correspondiente a el mismo, sino todavia va a apuntar al 
//constructor del prototipo padre
prototipoHijo.prototype.constructor = prototipoHijo;
}

function desarrollador(nombre,apellido,altura) {
    this.nombre = nombre;
    this.apellido = apellido;   
    this.altura = altura;
}
heredaDe(desarrollador,persona);

desarrollador.prototype.saludar = function() {
    console.log(`Hola, me llamo ${this.nombre} ${this.apellido} y soy desarrollador`);
}

Aún me cuesta entender la herencia de prototipo, sobre todo con el ejemplo de esta clase, es muy complejo!

Hola compañeros, quiero solucionar un duda que me surgio, en el minuto 12:25 de la clase Sacha llama la función arturo.soyAlto() la cual le arroja FALSE y deberia ser TRUE, la razon es porque en el constructor de Desarrolador que se hizo como ejemplo en esta clase no se agrego el atributo de altura, por este motivo la función no lo reconoce, si lo agregamos vemos que funciona perfectamente, espero les sirva compañeros.

function Desarrollador(nombre, apellido, altura) {
  this.nombre = nombre;
  this.apellido = apellido;
  this.altura = altura;
}```

Y para que sirve esto, seria bueno un ejemplo mas real… JavaScript me tiene vuelto loco.

Hasta ahora es el único aspecto que veo que es mas fácil en Java!

Esta clase es como: mira así se hace una herencia prototipal nivel jedi 🤐

Que pedo, que pedo xd

Yo lo que entiendo es que los desarrolladores no son personas, jajaja.

Clase complicada, toca verla varias veces para entenderlo mejor.

Para los que quieran profundizar más en este tema vayan al curso de programación orientada objeto o poo asi le quedara mas claro este módulo de poo javascript.

const ALTURA_PROMEDIO = 1.80;

function heredaDe(hijo, padre) {
    const noop = function () {};
    noop.prototype = padre.prototype;
    hijo.prototype = new noop();
    hijo.prototype.constructor = hijo;
} 

function Persona (nombre, apellido, altura) {
    this.nombre = nombre;
    this.apellido = apellido;
    this.altura = altura;

    Persona.prototype.saludar = function () {
        console.log(`Te saluda ${this.nombre} ${this.apellido}`);
    }
    
    Persona.prototype.soyAlto = function () {
        console.log(`Hola, soy ${this.nombre} ${this.apellido} y soy ${ this.altura >= ALTURA_PROMEDIO? 'alto' : 'bajo' }`);
    }
}

heredaDe(Desarrollador, Persona);

function Desarrollador (nombre, apellido) {
    this.nombre = nombre;
    this.apellido = apellido;

    Persona.prototype.saludar = function () {
        console.log(`Te saluda ${this.nombre} ${this.apellido} que es desarrollador/a`);
    }
}

var oscar = new Persona('Oscar', 'Perez', 1.75);
oscar.saludar();
oscar.soyAlto();

var oscar = new Desarrollador('Sara', 'Perez');
oscar.saludar();
oscar.soyAlto();

Al fin Platzi esta haciendo buenos cursos

Clase muy entretenida, Sacha hiciste trabajar mis neuronas!

Entendido, no hay herencia, pero si prototipos.

Haber si entendí :

  1. Los prototipos son objetos
  2. Todas las funciones llevan el atributo prototype
  3. Para que la herencia se aplique se debe de asignar al prototipo hijo el prototipo padre
  4. Para que las funciones de la clase hija sean aplicadas, la herencia debe ocurrir antes de que se declaren dichas funciones.

Entonces aquí

function heredaDe(prototipoHijo, prototipoPadre) {
	var foo = function(){}
	foo.prototype = prototipoPadre.prototype
	prototipoHijo.prototype = new foo
	prototipoHijo.prototype.constructor = prototipoHijo
}

básicamente le esta asignando el prototipo del objeto padre al objeto hijo…
de esa forma se heredan los atributos y funciones

La herencia como tal no existe en JS, no hay clases, hay prototipos. Y existe lo que es la herencia prototipal. Y buscará las propiedades del objeto en los prototipos superiores si no los encuentra, hasta llegar a object. Para ECMAScript < 2015

si esta dificil de entender

Si están teniendo problemas con que cargue el video, solo tienen que cambiar el servidor, generalmente está con el servidor A, cámbienlo al B o C.

Y donde quedo la explicacion sobre el this dentro de las arrow functions ?

algo no me quedó claro 😦, por que a fn.prototype le asignamos prototipoPadre.prototype, acaso el prototype de prototipoPadre no es un objeto por lo que la asignación de este en realidad referencia a una posición de memoria, por lo cual, no sería el mismo objeto exactamente? en el video Sacha dice que es para no pisar el prototipo del prototipoPadre, pero si son el mismo objeto entonces igual se pisaría o no?

Gracias ECMAScript 2015!

Si no entiendes mucho esto, no te desanimes y pasa a la siguiente clase. Ahí me entenderás.

Diomio no entendí muy buen, a verlo otra vez

La herencia como tal no existe en JS: Existen prototipos y éstos prototipos son los que se heredan.

Wow , no sabia que en JS no existían clases como en C# , C++, Java , es increíble por que este curso me incursiona en nuevos saberes , me encanta

En JS no hay clases, hay prototipos que son objetos a los que les vamos agregando métodos que reciben funciones.

Hay algo que me pasa a mi y no se si sera correcto. Esta falsa herencia sirve para “transladar” los metodos, pero los atributos de Persona no se terminan “Heredando” a desarrollador. Por ejemplo: en este caso Persona cuenta con el atributo “altura” , pero desarrollador no, y al hacer la “falsa herencia” desarrollador cuenta con el metodo soyAlto, pero no con el atributo .altura… estoy en lo correcto o es un error que solo me sucede a mi?

Pero cuando llamaste Arturo.soyAlto dio false y se supone que debería haber dado true.
no?

No entendí un jopo. Lo siento

Está algo complicada la clase, pero como que entiendo el bloque de la función heredaDe.

Algo complicada la clase, esperemos la que sigue 😃