Explica cómo funciona la herencia en JavaScript.
sobes.tech AI
Respuesta de la IA
La herencia en JavaScript se basa en prototipos. Cada objeto tiene una propiedad interna [[Prototype]] (accesible a través de __proto__ o Object.getPrototypeOf()), que apunta a otro objeto.
Al intentar acceder a una propiedad o método de un objeto, si no se encuentra directamente en el objeto, JavaScript lo busca en [[Prototype]] de ese objeto, luego en [[Prototype]] del prototipo, y así sucesivamente por la cadena de prototipos, hasta llegar al final (Object.prototype), cuyo [[Prototype]] es null.
Esto es herencia basada en prototipos.
Las clases en ECMAScript 2015 (ES6) son azúcar sintáctico sobre la herencia prototípica. Proporcionan una sintaxis más familiar para trabajar con prototipos y crear jerarquías de objetos.
Ejemplo de uso de herencia prototípica antes de ES6:
// Constructor del padre
function Animal(name) {
this.name = name;
}
// Método del padre en el prototipo
Animal.prototype.sayHi = function() {
console.log(`Hola, soy ${this.name}`);
};
// Constructor del hijo
function Dog(name, breed) {
// Llamada al constructor del padre
Animal.call(this, name);
this.breed = breed;
}
// Establecer el prototipo del hijo al prototipo del padre
// Manteniendo la referencia al constructor Dog
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;
// Añadir método del hijo
Dog.prototype.bark = function() {
console.log("¡Guau-guau!");
};
// Crear instancia del hijo
const myDog = new Dog("Boby", "Labrador");
// Usar métodos del padre y del hijo
myDog.sayHi(); // Salida: Hola, soy Boby
myDog.bark(); // Salida: ¡Guau-guau!
Ejemplo de uso de clases (ES6):
// Clase padre
class Animal {
constructor(name) {
this.name = name;
}
sayHi() {
console.log(`Hola, soy ${this.name}`);
}
}
// Clase hija que hereda de Animal
class Dog extends Animal {
constructor(name, breed) {
// Llamada al constructor del padre
super(name);
this.breed = breed;
}
bark() {
console.log("¡Guau-guau!");
}
}
// Crear instancia de la clase hija
const myDog = new Dog("Rex", "Pastor alemán");
// Usar métodos del padre y del hijo
myDog.sayHi(); // Salida: Hola, soy Rex
myDog.bark(); // Salida: ¡Guau-guau!
Puntos clave de la herencia en JavaScript:
- Prototipos: Cada objeto tiene un prototipo.
- Cadena de prototipos: La búsqueda de propiedades o métodos recorre los prototipos hacia arriba.
[[Prototype]]: Propiedad interna que apunta al prototipo.__proto__: Forma obsoleta pero común de acceder a[[Prototype]].Object.getPrototypeOf(): Forma recomendada de acceder a[[Prototype]].- Constructores y
prototype: Usados antes de ES6 para crear objetos y establecer sus prototipos. - Clases (ES6): Azúcar sintáctico para herencia prototípica usando
class,extends,super.