Javascript :: Intro

Document Object Model (DOM) que nos ayudara a manejarnos en javascript:

		->layer	->text
	->frame	->link	->password
window->	->document ->	->image	->hidden
	->location	->area	->submit
	->history	->anchor	->reset
		->applet	->radio
		->form ->	->checkbox
			->button
			->select ->	->option

Objetos personalizados en JavaScript

Aunque JavaScript no es un lenguaje puro de orientacion a objetos, tiene un mecanismo para la encapsulacion (agrupar y esconder informacion en un objeto).
Creamos un objeto llamado cartLineItem y con el operador punto se definen y asignan valores a nuestro objeto en particular:

cartLineItem=new Object();
cartLineItem.productID='MG1234';
cartLineItem.productName='MGB Roadster (1935)';
cartLineItem.quantity=1;
cartLineItem.unitPrice=36000;

Una instancia de cartLineItem se puede usar despues para referenciarla:

alert('Tienes'+cartLineItem.quantity+' ' +cartLineItem.productName + ' en tu carrito de la compra');


Asignar

Al igual que las propiedades (como productName), tambien los metodos se pueden asociar a nuestro objeto particular, siempre y cuando la funcion se haya descrito mas arriba en el documento. Escribimos la funcion total() , que es una funcion miembro de nuestro objeto, y mas tarde esta funcion tiene acceso a su objeto propietario a traves del operador this:

function total()
{
   return(this.quantity*this.unitPrice);
}

La funcion se asigna al objeto como si fuese una propiedad:

cartLineItem.total=total;

Una vez asignada al objeto, ya se la puede llamar directamente desde el objeto cartLineItem:

cartLineItem=new Object();
cartLineItem.productID='MG1234';
cartLineItem.productName='MGB Roadster (1935)';
cartLineItem.quantity=2;
cartLineItem.unitPrice=12500;
cartLineItem.total=total;
document.write( cartLineItem.quantity + '' +cartLineItem.productName +' te costara :' +cartLineItem.total() +' €');

Definir un prototipo

Para facilitar las cosas, podemos definir un prototipo (como un constructor de C++). El prototipo es una funcion que crea un objeto personalizado y opcionalmente inicializa las propiedades del objeto, que en el caso de un objeto de JavaScript, debe incluir las funciones. Aqui tenemos el prototipo de LineItem:

function LineItem(id,name,quantity,price)
{
this.productID=id;
this.productName=name;
this.quantity=quantity;
this.unitPrice=price;
this.total=total;
}

Con el prototipo definido, se puede crear un array de instancias de LineItem:

var cartLineItem=new Array();
cartLineItem[0]=new LineItem('MG123','MGB Mk I Roadster',1,36000);
cartLineItem[1]=new LineItem('AH736','Austin Healey Sprite',1,9500);
cartLineItem[2]=new LineItem('TS225',Triumph SpitFire Mk I',1,13000);