Javascript, como comentamos en el capítulo anterior, tiene un lenguaje que utiliza el POO basado en prototipos, no en clases.
Herencia
La herencia es la capacidad de poder heredar características de un padre a un hijo, eso se da con las clases con los lenguajes basados en clases, pero en Javascript, basado en prototipos, la herencia también se da a modo de cadena prototípica.
Para la herencia tenemos en la mayoría de los mensajes un método llamado denominado super() que manda llamar el constructor de la clase padre.
Aquí lo que nos creamos es una variable que cuelga del this a la cual la vamos a llamar super y va a ser igual al prototipo del cual nos vamos a basar para hacer la herencia.
Cuando una clase hija hereda de la clase padre, puede utilizar las propiedades y métodos de la clase padre, y puede generar nuevos métodos y propiedades, y tb se puede hacer una sobreescritura de los métodos de la clase padre.
Ejm
!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Herencia prototípica</title>
</head>
<body>
<h1>Herencia prototípica</h1>
<script>
function Persona(nombre, genero) {
// PROPIEDADES
this.nombre = nombre;
this.genero = genero;
}
Persona.prototype.hablar= function () {
console.log("Estoy hablando");
};
// HERENCIA PROTOTÍPICA
// CREO UNA CLASE Francisco QUE HEREDA DE Persona
function Francisco(nombre, genero, edad) {
this.super = Persona;
this.super(nombre, genero);
this.edad= edad;
}
// ESTA LINEA ES LA QUE ESTÁ HACIENDO LA HERENCIA
Francisco.prototype = new Persona();
Francisco.prototype.constructor = Francisco;
// SOBREESCRITURA DE MÉTODOS DEL PROTOTIPO PADRE EN EL HIJO
Francisco.prototype.hablar= function () {
console.log("Me llamo Francisco");
};
Francisco.prototype.caminar= function () {
console.log("estoy caminando");
};
// HACIENDO PRUEBAS
// OBJETO catalina
const catalina= new Francisco("Catalina", "Hembra", 60);
console.log(catalina.edad);
catalina.hablar();
catalina.caminar();
console.log();
// OBJETO gato
const eva= new Persona("Eva", "Mujer");
console.log(eva.nombre);
eva.hablar();
</script>
</body>
</html>
Si venimos de lenguajes basados en clases, no en prototipos, quizá nos cueste entender ésto. Todo lo que hemos visto en este capítulo lo hace Javascript por detrás, por lo que podemos hacer lo mismo pero con clases, cosa que veremos en el capítulo siguiente.