Bienvenidos sean a este post, hoy hablaremos sobre un elemento propio de otros lenguajes orientados a objetos como son los constructores, hasta ahora hemos visto como usando una notacion literal podemos crear objetos literales pero si nosotros queremos crear copias de estos objetos con las mismas propiedades y metodos debemos usar el tema de hoy.
Un constructor en realidad es una funcion anonima que define un nuevo objeto y lo devuelve, creando copias del objeto (se pueden llamar instancias tambien), cada una con sus propios valores, metodos y propiedades, veamos su sintaxis:
var nombreConstructor = function() {
var nombreObjeto = {
propiedad = valor,
var metodo = function(){
... instrucciones ...
}
};
return nombreObjeto;
};En este caso la primera variable sera una funcion anonima que sera nuestro constructor, luego crearemos otra variable que sera el objeto al cual copiaremos, exactamente de la misma forma como vimos en el post anterior, una vez finalizado y antes de salir del constructor devolvemos el objeto, inclusive nosotros podemos tener varios metodos para efectuar distintas tareas en nuestro objeto como se ve a continuacion:
var nombreConstructor = function() {
var nombreObjeto = {
propiedad = valor,
var metodo = function(){
... instrucciones ...
},
var metodo2 = function(<argumento>){
... instrucciones ...
}
};
return nombreObjeto;
};Pero siempre devolveremos al objeto que creamos dentro del constructor, para entender mejor este concepto veamos el siguiente ejemplo:
constructor.html
<html>
<script language="javascript">
<!--
document.title="Constructores";
var constructor = function(nombreInicial, salarioInicial){
var persona = {
nombre: nombreInicial,
salario: salarioInicial,
mostrar: function(){
document.write("Empleado: " + this.nombre);
document.write(", salario: " + this.salario + "<br>");
},
cambiarNombre: function(nombre){
this.nombre = nombre;
},
cambiarSalario: function(salario){
this.salario = salario;
}
};
return persona;
};
//-->
</script>
<body>
<script language="javascript">
<!--
var empleado1=constructor("Martin","10000");
var empleado2=constructor("Enzo","9000");
var empleado3=constructor("Ariel","8000");
empleado1.mostrar();
empleado2.mostrar();
empleado3.mostrar();
empleado1.cambiarNombre("Martin Miranda");
empleado2.cambiarNombre("Enzo Tortore");
empleado3.cambiarNombre("Ariel Polizzi");
empleado1.cambiarSalario(17000);
empleado2.cambiarSalario(16000);
empleado3.cambiarSalario(16000);
document.write("<br>Cambiemos los datos<br><br>");
empleado1.mostrar();
empleado2.mostrar();
empleado3.mostrar();
//-->
</script>
</body>
</html>En este caso creamos un constructor llamado constructor (muy conveniente), la cual recibira dos argumentos (nombreInicial y salarioInicial) los cuales nos serviran para iniciar las dos propiedades del objeto dentro de constructor (persona) y dentro de persona tendremos tres metodos, uno que muestra los valores de las propiedades del objeto, el siguiente para cambiar el valor de nombre (cambiarNombre) y el ultimo para cambiar a salario (cambiarSalario), una vez cerrado este objeto devolveremos al mismo y con esto finalizamos al constructor.
Nota: Observen como hemos usado a this para que pueda utilizar internamente las propiedades del objeto.
En el siguiente bloque crearemos tres empleados (empleado1, empleado2 y empleado3) y para iniciarlos usamos a constructor para completar todos los datos, en el siguiente caso usamos a mostrar de cada uno de los empleados donde debera traernos los datos cargados, como hice dos funciones para modificar el nombre y el salario observen como hice un bloque extenso para modificar el nombre y el salario de cada uno de los empleados, luego creamos un corte y por ultimo volvemos a mostrar los nuevos valores, si probamos el ejemplo obtendremos la siguiente salida
Vemos como con un solo objeto pudimos controlar tres objetos distintos y cada uno con su informacion sin interponerse uno con el otro, y como luego pudimos modificarla sin ningun inconveniente.
En resumen, hoy hemos visto constructores en Javascript, si bien no son los constructores de otros lenguajes (p.e. C++) tiene sus herramientas para mejorar el uso de Javascript, nos permite ampliar el uso y simplificando al mismo tiempo, hemos visto algunas de sus caracteristicas, su sintaxis y un ejemplo donde lo pusimos en practica, espero les haya sido util sigueme en tumblr, Twitter o Facebook para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.
Tengo un Patreon donde podes acceder de manera exclusiva a material para este blog antes de ser publicado, sigue los pasos del link para saber como.
Tambien podes donar
Es para mantenimiento del sitio, gracias!
$1.50
El blog de Tinchicus 