Javascript Básico

Variables tipo Objeto

Este tipo de variables al igual que los arrays almacenan valores de diferentes tipos de datos, pero a diferencia de los arrays estos tienen relacionados una llave para acceder a los datos.

Los variables de tipo objeto está compuestos de atributos y métodos, a los que se accede a través de la notación por punto.

  • llave.atributo;
  • llave.método();

Ejemplo variable tipo Objeto - CARRO.

var carro = {
    marca : "Chevrolet", 
    modelo: 2014, 
    color : "Rojo", 
    numeroDePuertas : 4, 
    velocidad : 0, 
    arrancado : false,
    arrancar : function()
    {        
        this.arrancado = true;
    },
    parar: function()
    {        
        this.arrancado = false;
    },
    descripcionCarro: function()
    {
        var txt = "Carro " + this.marca + " color " + this.color;
        txt += "\nPuertas: " + this.numeroDePuertas;
        txt += "\nSe encuentra " + (this.arrancado ? "Ecendido" : "Apagado");
        console.log(txt);
    }
};

En el anterior ejemplo se observa el objeto carro, el cual tiene una serie de atributos y métodos.

console.log(carro.marca);
//Imprime: Chevrolet

console.log(carro.color);
//Imprime: Rojo

carro.arrancado;
//Imprime: false

carro.descripcionCarro();
/*
Imprime
Carro Chevrolet color Rojo
Puertas: 4
Se encuentra Apagado
*/
//Arranca el carro cambiando el atributo arrancado a verdadero...
carro.arrancar();

carro.descripcionCarro();
/*
Imprime, se observa que ahora el carro está encendido...
Carro Chevrolet color Rojo
Puertas: 4
Se encuentra Encendido
*/

TIP


Como se observa en este código se han manejado elementos como funciones y encadenación de Strings así como el operador ternario (?), temas que se verán en un posterior capítulo.


Array de objetos

En el ejemplo anterior se pudo observar al creación de un sólo elemento de tipo carro, si se desea crear varios elementos se puede realizar un array de objetos, está notación es la conocida como Json (JavaScript Object Notation)

var carros = [{
                marca : "Chevrolet", 
                   modelo: 2014, 
                   color : "Rojo", 
                   numeroDePuertas : 4
              }, 
              {
                  marca : "Mazda", 
                   modelo: 2012, 
                   color : "Azul", 
                   numeroDePuertas : 5
              }, 
              {
                  marca : "Twingo", 
                   modelo: 2005, 
                   color : "Negro", 
                   numeroDePuertas : 3
              }];

//Imprime Mazda
console.log(carros[1].marca);

Posteriomente se mostrará la forma de realizar este proceso a través de una función constructor y la asociación de métodos a los elementos de un objeto.

TIP


En los archivos con extensión .json, el nombre de la llave debe estar en comillas dobles, cuando se declara un array de objetos en Javascript, las llaves pueden o no estar dento de comillas dobles, como se evidenció en el ejemplo anterior.

Archivo .json

[
   {
      "marca":"Chevrolet",
      "modelo":2014,
      "color":"Rojo",
      "numeroDePuertas":4
   },
   {
      "marca":"Mazda",
      "modelo":2012,
      "color":"Azul",
      "numeroDePuertas":5
   },
   {
      "marca":"Twingo",
      "modelo":2005,
      "color":"Negro",
      "numeroDePuertas":3
   }
]