5 formas de crear objetos en JavaScript

5 formas de crear objetos en JavaScript

Hoy vamos a ver con más profundidad un aspecto de un lenguaje de programación llamado JavaScript, del cual hemos hablado en posts anteriores pero del que nunca hemos visto su funcionamiento. No vamos a ver cómo programar desde 0 con él pero, al menos, echaremos un vistazo a unos elementos muy útiles, los objetos.

Sin embargo, antes de continuar, apuntar que, pese a que el nombre de Javascript se parece mucho al de otro lenguaje llamado Java, no tienen niguna relación. Saber JavaScript no te garantiza el conocimiento de Java, ya que actúan de formas distintas. Si destacamos una diferencia principal es que JavaScript es un lenguaje web, por lo que sólo necesitamos el navegador para poder ver los resultados, mientras que Java se debe compilar previamente para generar un archivo ejecutable, de modo que necesitamos un entorno de desarrollo (IDE) más complejo, como por ejemplo Eclipse.

¿Qué es un objeto en JavaScript?

Ahora que ya sabemos esto, ¿qué es un objeto? Antes de definirlo, debemos entender el concepto de variable: un elemento cuyo valor varía (válgame la redundancia).

Un objeto es una variable con esteroides, ya que no sólo puede tener un valor, sino varias propiedades. Por ejemplo, imaginemos que tenemos una variable coche. Si lo convertimos en objeto le daríamos las propiedades “puerta” “ruedas”, etc. Vamos a verlo con unos cuantos ejemplos.

Cómo crear objetos en JavaScript y tener acceso a ellos

1. La forma básica 

Vamos a ver un ejemplo de creación básica, y para mí la más sencilla. De hecho es la que yo uso normalmente. La idea es crear el objeto y sus propiedades en un solo paso, del modo siguiente.

var = coche{

puertas: “2”,

ruedas: “4”,

color: “azul”

};

Aquí observamos que hemos creado el objeto, que no deja de ser una variable y, a continuación, le atribuimos las propiedades. En nuestro ejemplo hemos usado el “coche” para seguir el texto anterior, y vemos que le damos las propiedades “puertas”, “ruedas” y “color”. Esta sería la manera más básica de crear objetos, ya que lo haces todo de golpe, y para mi es la más clara. El pequeño problema que hay es que debes tener claras las propiedades desde el inicio porqué no podrás añadir más mas adelante, pero es la que recomiendo cuando estáis empezando porqué os fuerza a haber hecho una buena estructuración del programa previamente.

2. La forma más compleja 

Imaginemos ahora que no sabemos cuántas propiedades vamos a tener. No pasa nada, porque tenemos otro modo de crear estos objetos. Puede parecer más atractiva por ser más amiga al desarrollo sin previo estudio del proyecto, pero os recomendaría aprender a usar la primera y cuando la dominéis entonces hacer uso de esta. Vamos allá:

var coche = new Object();

coche.puertas = “2”;

coche.ruedas = “4”;

coche.color = “azul”;

Aquí lo que tenemos es la creación en la primera línea del objeto, seguido de la atribución de las propiedades. Como digo, esta es más amiga porque podemos crear propiedades nuevas sin tener que volver páginas atrás, es decir, podemos hacer una propiedad nueva en cualquier momento. Por eso no es de mi preferencia, ya que puede hacer que el código esté desordenado y confundirnos más. Mientras que si está todo en el mismo bloque, siempre sabemos que es allí donde encontraremos todo lo que necesitamos.

3. La forma alternativa 

Este tercer modo es muy parecido al anterior, con la diferencia de que en vez de usar el punto para definir la propiedad, usaremos los corchetes. Parece un cambio ridículo, pero a nivel visual es posible que para algunos programadores sea más claro ya que separa de manera más evidente qué es cada parte. Si usamos el ejemplo anterior, la definición de propiedades nos quedaría:

coche[“puertas”] = “2”;

coche[“ruedas”] = “4”;

coche[“color”] = “azul”;

Fijaos que la idea es la misma, pero ahora se ve mucho más claro qué es el objeto y qué es la propiedad. De modo que si vais a trabajar así, éste es el método que os recomendaría.

4. Acceso a los objetos.

Ahora bien, ¿cómo accedemos a estas propiedades cuando las necesitamos? Está claro que si hemos hecho todo esto es para recurrir a ello en cualquier momento. Acceder a los objetos es muy simple:

nombreDelObjeto.nombeDeLaPropiedad tal que (con nuestro ejemplo)

coche.puertas;

Si hacemos esto, estaremos accediendo al valor que tenga en ese momento “puertas”, el cual podemos recoger para usarlo en otra parte del código, o modificarlo. Además nos puede venir muy bien para hacer objetos en serie, tal y como os mostraré en el punto 5. También es posible usar los corchetes como hemos visto antes, tal que:

coche[“puertas”];

Ambos ejemplos hacen la misma función, de modo que ya queda a vuestra elección.

5. Objeto plantilla

Y para terminar, un uso potente de los objetos es el de hacer plantillas para definir otros objetos más adelante. Tomando como punto de partida los coches, imaginemos que vamos a definir distintos modelos como objetos, es decir, “Fiat” y “Ford”, los cuales la única diferencia que tienen entre ellos es el fabricante. Empezaríamos de la siguiente manera:

Definimos la plantilla (del modo que vosotros prefiráis)

var = coche{

puertas: “2”,

ruedas: “4”,

color: “azul”

};

Definimos un objeto para los fabricantes

var = fabricantes{

marca1: “Ford”,

marca2: “Fiat”,

};

Hemos hecho un objeto nuevo, llamado “fabricantes”, el cual hemos llenado con los dos fabricantes que deseamos.

Definimos el objeto Ford y Fiat

var = Ford{

puertas: coche.puertas,

ruedas: coche.ruedas,

color: coche.color,

fabricante: fabricantes.marca1

};

var = Fiat{

puertas: coche.puertas,

ruedas: coche.ruedas,

color: coche.color,

fabricante: fabricantes.marca2

};

Explicación

¿En qué nos beneficia esto? Ahora si por el motivo que sea, los dos coches, Fiat y Ford, cambian de color, únicamente debemos ir al objeto “coche” y cambiar la propiedad asignada a esto, y automáticamente se cambiara en ambos modelos. Es evidente que esto nos puede ahorrar una de trabajo inmensa en el caso de que tengamos muchos datos, evitando que tengamos que ir objeto por objeto cambiando un sólo parámetro.

Como podéis ver, los objetos pueden llegar a ser muy útiles, y es un concepto que se usa en muchos lenguajes de programación, si no todos, por lo que su aprendizaje no es para nada perder el tiempo. Yo os animo a dominarlos porque, como hemos visto en el punto 5, cuando se trata de trabajar con muchos datos, nos pueden quitar horas de faena si  llegamos a estructurar adecuadamente todas las variables.

¿Os parece muy difícil? Hacedme saber qué pensáis de este concepto, ya un poco más avanzado, de la programación y si pensáis que es útil, en la caja de comentarios. Estaré encantado de leer vuestras opiniones.

 

Curso relacionado: Curso de Programación con HTML5 y CSS