Introducción a los objetos en JavaScript
Aunque JavaScript está muy orientado a eventos, como iremos viendo dentro de poco, los objetos son muy importantes en la programación, sobre todo en el paradigma actual, por eso en esta entradas veremos una introducción a los objetos en JavaScript, y en las siguientes iremos profundizando en ellos.
Como hemos estado viendo hasta ahora, todo en JavaScript puede ser tratado como objetos, aunque no todo se debe de usar como tal, en especial los datos primitivos (cadenas, números, booleanos, null y undefined)…
- Los booleanos pueden ser usados como objetos, aunque son datos primitivos
- Los números pueden ser usados como objetos, aunque son datos primitivos
- Las cadenas (strings) pueden ser usadas como objetos, aunque son datos primitivos
- Las fechas siempre son objetos
- Math siempre es un objeto
- Las expresiones regulares son objetos
- Los arrays son objetos
- Las funciones son objetos
- y naturalmente los objetos son objetos
Viendo los objetos como colecciones de variables
Analizando esto, podemos determinar que las variables contienen valores simples, mientras que los objetos guardan una colección de valores, de ese modo una variable podría ser:
var persona = "Juana Calamidad";
Mientras que un objeto contiene diferentes valores dispuestos en pares nombre : valor creando una colección de variables desordenadas.
var persona = {nombre:"Juana", apellido:"Calamidad", edad:"34", ojos:"marrones"};
Los pares nombre : valor, se denominan propiedades en JS y son similares a los arrays asociativos de PHP, un tipo de array que como vimos no existe en JS.
Las propiedades de un objeto pueden ser primitivos, otros objetos y funciones.
Creación de un objeto JavaScript
Existen diferentes formas de crear un objeto, tal y como vemos a continuación:
Uso de un objeto literal
Es la forma mas sencilla, ya que puede definir y crear un objeto directamente en el interior de llaves, e introduciendo las propiedades dentro.
Finalmente para acceder a las propiedades es tan sencillo como poner: nombreDelObjeto.propiedad
var persona = {nombre:"Juana", apellido:"Calamidad", edad:"34", ojos:"marrones"}; persona.edad; //devuelve la edad de persona en este caso 34
También se puede declarar el objeto en diferentes líneas, aunque deberemos de respetar los saltos de línea y el indexado:
var persona = { nombre:"Juana", apellido:"Calamidad", edad:"34", ojos:"marrones" }; persona.edad; //devuelve la edad de persona en este caso 34
Utilizando la palabra clave Object()
Podemos crear el mismo objeto con la palabra clave Object(), aunque la legibilidad y la velocidad son peores, por lo que se recomienda utilizar la forma literal en lugar de esta.
var persona = new Object(); persona.nombre = "Juana"; persona.apellido = "Calamidad"; persona.edad = "34"; persona.ojos = "marrones";
Usando un constructor
Los dos ejemplos anteriores están limitados a la creación de un solo objeto, pero en muchas ocasiones necesitaremos tener muchos objetos similares, por ejemplo alumnos, libros, coches… por esta razón es por la que se deben de utilizar constructores como en el siguiente ejemplo:
function persona(nombre, apellido, edad, ojos){ this.nombre = nombre; this.apellido = apellido; this.edad = edad; this.ojos = ojos; } var antonio = new person("Antonio", "Ramirez", 20, "marrones"); var maria = new person("Maria", "Gonzalez", 25, "verdes"); maria.edad //nos devuelve la edad de maria.
Ya conocemos bastante de JS para saber como funciona este código, primero declaramos una función que recibe una serie de argumentos y estos argumentos se utilizan para la creación del objeto.
Si queremos crear objetos tan solo tenemos que hacerlos como en las líneas 7 y 8, y si queremos acceder a cualquier propiedad es tan sencillo como en la línea 10.
Pero hay algo en este código que aun no hemos visto y es la palabra this, esta palabra hace referencia al objeto que se esta tratando en ese momento dentro de la función.