Resumen: Resumen: en este tutorial, aprenderá a usar el patrón de constructor-prototipo (constructor/prototype) de JavaScript para definir un tipo personalizado.
Introducción patrón constructor/prototype
En el artículo anterior, se explicó en detalle cómo funciona el concepto de prototype en JavaScript, y su importancia en la creación de objetos y tipos personalizados. Ahora, es momento de profundizar un poco más y ver cómo combinar la función de constructor y el patrón de prototype para crear tipos personalizados aún más avanzados.
Patrón de constructor/prototype
El patrón de constructor/prototype es una técnica de programación que combina la funcionalidad de una función constructora y un objeto prototype. Aquí, la función constructora es utilizada para definir las propiedades básicas del objeto, mientras que el objeto prototype es utilizado para definir las funciones y métodos compartidos por todas las instancias de ese objeto.
Ejemplo básico del uso de constructor y prototype
Por ejemplo, supongamos que queremos crear un tipo de objeto "Persona" con propiedades como nombre, edad y profesión. La función constructora puede ser utilizada para definir estas propiedades y asignarlas a cada instancia de objeto "Persona" cuando se crea. Por otro lado, el objeto prototype puede ser utilizado para definir un método compartido por todas las instancias de objeto "Persona" llamado "saludar", que simplemente devuelve una salutación personalizada basada en el nombre y la edad de la persona.
function Persona(nombre, edad, profesion) {
this.nombre = nombre;
this.edad = edad;
this.profesion = profesion;
}
Persona.prototype.saludar = function() {
return `Hola, soy ${this.nombre} y tengo ${this.edad} años y trabajo como ${this.profesion}.`;
}
const persona1 = new Persona("Juan", 30, "Programador");
const persona2 = new Persona("María", 25, "Enfermera");
console.log(persona1.saludar());
// "Hola, soy Juan y tengo 30 años y trabajo como Programador."
console.log(persona2.saludar());
// "Hola, soy María y tengo 25 años y trabajo como Enfermera."
Como se puede ver, la función constructora Persona se utiliza para definir las propiedades nombre, edad y profesión de cada instancia de objeto "Persona". Por otro lado, el objeto prototype se utiliza para definir el método saludar, que es compartido por todas las instancias de objeto "Persona".
Ejemplos de implementación de constructor y prototype
Aquí te muestro cómo implementar el patrón de constructor/prototype:
function Juguete(nombre, tipo) {
this.nombre = nombre;
this.tipo = tipo;
}
Juguete.prototype.mostrarNombre = function() {
console.log(this.nombre);
};
var juguete1 = new Juguete("Muñeco de nieve", "muñeco");
var juguete2 = new Juguete("Auto a control remoto", "juego electrónico");
juguete1.mostrarNombre(); // muestra "Muñeco de nieve"
juguete2.mostrarNombre(); // muestra "Auto a control remoto"
En este ejemplo, creamos una función de constructor llamada Juguete que tiene dos propiedades: nombre y tipo. Luego, utilizamos Juguete.prototype para agregar un método llamado mostrarNombre que muestra el nombre del juguete en la consola. Por último, creamos dos objetos juguete1 y juguete2 utilizando la función de constructor y llamamos al método mostrarNombre en cada objeto.
Importancia de constructor/prototype
El patrón de constructor/prototype es importante porque permite la creación de objetos reutilizables y que comparten propiedades y métodos comunes. Esto mejora la eficiencia de la programación y hace que sea más fácil de mantener y depurar. Además, permite la creación de jerarquías de objetos y una mayor dinamicidad en la aplicación.
Resumen
En este artículo hemos aprendido sobre el patrón de constructor/prototype en JavaScript, una combinación de la función de constructor y el patrón de prototype para definir tipos personalizados. Hemos visto cómo implementar este patrón con un ejemplo concreto y la importancia de utilizarlo en la programación. Este patrón es una herramienta valiosa para los desarrolladores que desean crear objetos reutilizables y mejorar la eficiencia de su código.
Esperamos que este artículo te haya sido de ayuda y que lo hayas encontrado interesante. ¡No dudes en dejar un comentario o compartir este artículo con tus amigos y colegas para continuar aprendiendo juntos!
