sábado, 25 de enero de 2014

Crear objetos en JavaScript


Para crear objetos en javascript primero creamos un constructor de la siguiente manera:


function ConstructorClase() 

  // inicializamos propiedades
  this.propiedad1 = valor 
}

podemos hacerlos pasando parámetros:

function ConstructorClase(param1, param2,.... paramX)

  // inicializamos propiedades
  this.propiedad1 = param1;
  this.propiedad1 = param2;
  .
  .
  .
  this.propiedad1 = paramX;


El operador "this" nos permite referirnos al propio objeto de la clase.
Para crear los métodos de la clase basta con definir una función y asociarla a la clase de al siguiente manera :

1. Declaramos una función

function funcionClase(param1, param2,.... paramX)

  // instrucciones de la función
}

2. Asociamos la función a la clase en su propio constructor

function ConstructorClase(parámetro1, parámetro2,.... parámetro x)

  // inicializamos propiedades
  this.nombreMetodo = funcionClase
}

Si nos fijamos bien esta práctica no es del todo segura ya que estamos definiendo la función de forma global. Esto está relativamente bien hecho; pero para encapsular aún más nuestra clase, debemos declarar nuestra función y su correspondiente asociación a la clase dentro de la misma; es decir en su propio constructor. De la siguiente manera:

function ConstructorClase(parámetro1, parámetro2,.... parámetro x)

  // inicializamos propiedades
  this.nombreMetodo = function (parámetro1, parámetro2,.... parámetro x
  {
    // instrucciones de la función
  } 
}



Por último; para crear o instanciar un objetos haremos uso del operador "new" :

Clase nombreObjeto = new Clase(param1, param2, ... paramX);

Usamos el método de la siguiente forma:

nombreObjeto.metodo1();


Para terminar nada mejor que un buen ejemplo real para poder entender estos conceptos y crear sin problema nuestros propios objetos en javascript.

CLASE AVIÓN
------------------------

// Declaramos una clase llamada Avion que tiene 4 propiedades; cuyo constructor recibe tres // parámetros (marca. modelo y pasajeros ), el cuarto parámetro se inicializa a 0 en el 
// momento de la creación del objeto; posteriormente se le puede dar un valor llamando al 
// método rellenarDeposito que recibe como parámetro la cantidad de litros de combustible a // rellenar.

function Avion(marca, modelo, pasajeros)

  // inicializamos propiedades
  this.maraca = marca;
  this.modelo = modelo;
  this.pasajeros = pasajeros;
  this.cantidad = 0;
  this.rellenarDeposito = function (litros
  {
    // instrucciones de la función
    this.cantidad = litros;    
  } 
}



Finalmente hacemos uso de la clase de la siguiente manera:

Avion nuevoAvion = new Avion("Boeing","777","450");
nuevoAvion.rellenarDeposito(500);


Debemos tener en cuenta que el constructor se escribe con mayúscula la primer letra de cada palabra y los métodos deben empezar por minúscula y expresarlos mediante algún verbo que describa su función.