El lenguaje JavaScript no es un lenguaje orientado a objetos completo,
pero permite definir clases con sus atributos y responsabilidades.
Finalmente nos permite definir objetos de estas clases.
Pero el otro pilar de la programación orientada a objetos, es decir la herencia, no está implementada en el lenguaje.
Veremos la sintaxis para la declaración de una clase y la posterior definición de objetos de la misma.
Desarrollaremos una clase que represente un cliente de un banco.
La clase cliente tiene como atributos:
Pero el otro pilar de la programación orientada a objetos, es decir la herencia, no está implementada en el lenguaje.
Veremos la sintaxis para la declaración de una clase y la posterior definición de objetos de la misma.
Desarrollaremos una clase que represente un cliente de un banco.
La clase cliente tiene como atributos:
nombre saldoy las responsabilidades o métodos de la clase son:
Constructor (inicializamos los atributos del objeto) depositar extraerLuego debemos implementar los siguientes métodos (normalmente el constructor se utiliza el caracter mayúscula):
function Cliente(nombre,saldo) { this.nombre=nombre; this.saldo=saldo; this.depositar=depositar; this.extraer=extraer; } function depositar(dinero) { this.saldo=this.saldo+dinero; } function extraer(dinero) { this.saldo=this.saldo-dinero; }El nombre de la clase coincide con el nombre de la función principal que implementamos (también llamado constructor de la clase):
function cliente(nombre,saldo) { this.nombre=nombre; this.saldo=saldo; this.depositar=depositar; this.extraer=extraer; }A esta función llegan como parámetro los valores con que queremos inicializar los atributos. Con la palabra clave 'this' diferenciamos los atributos de los parámetros (los atributos deben llevar la palabra clave this)
this.nombre=nombre; this.saldo=saldo;También en el constructor inicializamos la referencia a todos los métodos que contendrá la clase (esto es muy importante y necesario para entender porque las otras dos funciones pertenecen a esta clase):
this.depositar=depositar; this.extraer=extraer;Por último, implementamos todos los métodos de la clase:
function depositar(dinero) { this.saldo=this.saldo+dinero; } function extraer(dinero) { this.saldo=this.saldo-dinero; }De nuevo recordemos que diferenciamos los atributos de la clase por la palabra clave this.
Ahora veamos el archivo HTML completo donde además definiremos un objeto de la clase planteada:
<html> <head> <title>Problema</title> <script type="text/javascript"> function Cliente(nombre,saldo) { this.nombre=nombre; this.saldo=saldo; this.depositar=depositar; this.extraer=extraer; } function depositar(dinero) { this.saldo=this.saldo+dinero; } function extraer(dinero) { this.saldo=this.saldo-dinero; } </script> </head> <body> <script type="text/javascript"> var cliente1; cliente1=new Cliente('diego',1200); document.write('Nombre del cliente:'+cliente1.nombre+'<br>'); document.write('Saldo actual:'+cliente1.saldo+'<br>'); cliente1.depositar(120); document.write('Saldo luego de depositar $120---->'+cliente1.saldo+'<br>'); cliente1.extraer(1000); document.write('Saldo luego de extraer $1000---->'+cliente1.saldo+'<br>'); </script> </body> </html>
Hemos dividido la declaración de la clase en un bloque Javascript
distinto a donde definimos un objeto de la misma, esto no es
obligatorio, pero podemos ver que queda más claro.
Para definir un objeto de la clase Cliente tenemos:
var cliente1; cliente1=new Cliente('diego',1200);
Luego las llamadas a métodos le antecedemos el nombre del objeto llamado cliente1:
document.write('Nombre del cliente:'+cliente1.nombre+'<br>'); document.write('Saldo actual:'+cliente1.saldo+'<br>'); cliente1.depositar(120); document.write('Saldo luego de depositar $120---->'+cliente1.saldo+'<br>'); cliente1.extraer(1000); document.write('Saldo luego de extraer $1000---->'+cliente1.saldo+'<br>');Podemos decir que la ventaja que podemos obtener con el planteo de clases es hacer nuestros programas mucho más organizados, entendibles y fundamentalmente, poder reutilizar clases en distintos proyectos.
No hay comentarios.:
Publicar un comentario