-Comprender mejor la esencia de la programación orientada a objetos (POO), sus literales, modificación, entre otros. También, veremos algunos ejemplos.
Este módulo está desarrollado con el objetivo de mostrar el potencial de JavaScript en lo que respecta a la POO. Por esta razón, se dará énfasis a su utilidad mientras que se explica cómo crear y manipular objetos.
Ahora bien, para facilitar el aprendizaje del curso, aportaremos un breve repaso sobre conceptos fundamentales que deben manejarse a la hora de programar bajo este paradigma. Veamos.
Cuando hablamos de objetos nos referimos a una entidad compuesta por variables y funciones que se relacionan entre sí. A estas variables y funciones se le conoce como propiedades y métodos que delimitan al objeto.
Crear un objeto es bastante sencillo, únicamente basta con definir e inicializar una variable. Por ejemplo:
var NombreObjeto = {}; var persona = {};
Con esta sintaxis hemos creado un objeto. No obstante, para añadirle datos debemos escribir lo siguiente:
var NombreObjeto = { propiedad1 = "valor", metodo1 = function( ){ //sentencia }; } var persona = { nombre = "Camilo", edad = 29, pasatiempo = ['futbol', 'canto', 'cine'], saludo = function (){ alert ("Hola, Soy " + this.nombre + ".")} }
Lo anterior es la forma de agregar datos y funcionalidades a un objeto.
Por lo tanto, el objeto “persona” ahora está compuesto por las propiedades “nombre, edad, pasatiempo”, y el método llamado “saludo”, que consiste en una función que muestra un mensaje a través de una ventana emergente.
Como hemos visto el valor que le damos a cada elemento puede ser de cualquier tipo (carácter, cadena, numérico o función).
Al tipo de objeto que acabamos de describir se le conoce como literal de objeto; esto se debe a que hemos escrito literalmente su contenido.
Por lo general se utiliza para transferir una variedad de datos estructurados que guardan relación; este tipo de objeto resulta mucho más eficiente que enviar varios elementos de forma individual y es mucho más fácil de mandar que una matriz. Es muy común en el envío de formularios.
Una manera de acceder a las propiedades y métodos de un objeto previamente definido es utilizando la notación de puntos.
Es decir, usando la sintaxis más común en la que escribimos la denominación del objeto y luego de un punto y seguido, el elemento que queremos extraer; puede ser simplemente una propiedad, un dato específico o la llamada a uno de los métodos que posee.
persona.nombre; // Camilo persona.pasatiempo[1]; // canto persona.saludo(); // Hola, Soy Camilo
Un espacio de nombres es básicamente un contenedor abstracto donde pueden almacenarse uno o más identificadores únicos. Es una técnica útil para organizar proyectos de gran tamaño.
Por otra parte, también existe el espacio de nombres secundarios, el cual permite establecer un identificador a cada elemento guardado.
Para comprender estos conceptos veamos el siguiente ejemplo:
pasatiempo = ['futbol', 'canto', 'cine'],
A este espacio de nombre lo subdividiremos para crear un identificador especifico por pasatiempo. Es decir:
pasatiempo: { uno: 'futbol', dos: 'canto', tres: 'cine' },
Como vemos, el valor de esta propiedad ahora es otro objeto (uno, dos, tres) a los cuales se le suele llamar espacio de nombre secundario.
Ahora bien, para acceder a ellos solo debemos agregarlo al final de la sentencia incluyendo otro punto. Como lo vemos a continuación:
persona.pasatiempo.uno; persona.pasatiempo.dos; persona.pasatiempo.tres;
Otra forma de obtener acceso a las propiedades de un objeto es mediante la notación de corchetes. Es decir, en lugar de utilizar el punto, usaremos corchetes.
persona.edad; persona.pasatiempo.uno;
Se puede utilizar los corchetes, como si de una matriz se tratara:
persona['edad']; persona['pasatiempo']['uno'];
Nota: la notación de corchetes es la razón por la que a los objetos se les denomina matrices asociativas, pues mapean cadenas a valores igual que se hace en las matrices cuando se asigna un número a cada valor.
A la hora de programar una aplicación en ocasiones es preciso modificar o cambiar el valor de los elementos de un objeto. Para ello, debemos declarar el elemento que se desea actualizar utilizando la notación de puntos o de corchetes, tal como muestra el siguiente ejemplo:
persona.edad = 45; persona['pasatiempo']['dos'] = 'dibujar';
Después de modificarlo, podemos comprobar que el cambio se ha realizado si hacemos el llamado a estos elementos como ya se explicado anteriormente:
console.log(Persona.edad); console.log(persona['pasatiempo']['dos']);
Otra ventaja de JavaScript es que no solo es posible cambiar el valor de las propiedades y métodos de un objeto, también proporciona la posibilidad de crear nuevos elementos que resultan útiles durante la ejecución del programa.
Para lograrlo debemos escribir lo siguiente:
persona['profesion'] = 'maestro'; persona.mensaje = function(){ alert("Buenos días a todos"); }
Veamos el resultado:
console.log(persona['profesion']); // maestro persona.mensaje(); // Buenos dìas a todos
Añadir elemento desde la web
A veces resulta necesario que el usuario mismo sea quien determine donde y como guardar sus datos. Por ejemplo, supongamos que mediante un formulario se le pida escribir la descripción de lo que necesita guardar y el valor en cuestión.
Para ello, el primer paso será extraer lo que el usuario ha escrito en las entradas de texto. Para ello escribimos las siguientes líneas de código:
var nombreObjeto = nameInput.value; var objetoValor = nameValue.value;
Lo siguiente será añadir esta nueva propiedad al objeto persona:
persona[nombreObjeto] = objetoValor;
Y, por último, probamos que el código funcione como se ha previsto:
var nombreObjeto = 'estadoCivil'; var objetoValor = 'soltero'; persona[nombreObjeto] = objetoValor;
Cabe destacar que agregar una propiedad a un objeto solo es posible con la notación de corchetes; pues la notación de puntos únicamente acepta un nombre de miembro literal, no una variable.
El propósito de este paradigma es utilizar objetos para modelar o esquematizar cosas del mundo real que deben ser representadas en el programa.
Por esta razón, a fin de proporcionar una forma sencilla de acceder a su funcionalidad, a cada objeto se le proveen datos y códigos relacionados que sirven para simbolizar sus características y comportamiento.
Crea el objeto “alumno” con las propiedades “nombre”, “nota1”, “nota2”, “nota3” y con un método que sirva para calcular su nota promedio. Luego añade la propiedad “apellido”, modifica la nota3 y muestra en pantalla los datos del alumno y el promedio de nota. Incluye además una propiedad contenida en una variable.
var alumno = { nombre = "Camilo", nota1 = 15, nota2 = 10, nota3 = 02, promedio = function (){ calculo = nota1+nota2+nota3/3 } }
Salida por consola:
Datos del alumno y promedio de nota
Salida por consola:
Camilo Pérez obtuvo un promedio de 15 puntos en la materia Programación