Programación Orientada a Objetos con Javascript: Un sencillo ejemplo

02/Ago/2012 JavaScript , , 1 Comentario

Javascript es un lenguaje de programación que permite ampliar las posibilidades de las páginas HTML. El navegador se encarga por completo de interpretar el código escrito y no hay necesidad de compilación.

Para incluir código Javascript en páginas HTML es necesario hacer uso de la etiqueta

  1. <script>...</script>

De esta forma insertaremos código Javascript de la siguiente forma:

  1. <script language="javascript" type="text/javascript">
  2. <!-- // tu código aquí -->
  3. </script>

También se pueden usar scripts externos:

  1. <script language="javascript" type="text/javascript" src="/js/miScript.js">

Así, por ejemplo, vamos realizar algo de programación orientada a objetos con Javascript. De esta forma haremos un ejemplo para obtener el valor futuro de una inversión (su valor) dado una tasa de interés y periodo o plazo final. Tenemos entonces tres datos:

  • valor presente
  • tasa de interés
  • periodo final

La fórmula para calcular el valor futuro es:

valor_futuro=valor*Math.pow(1+tasa/100,periodo)

Vamos a definir una función que sirva como "constructor" de la clase Economica:

  1. console.log("Creo el Constructor");
  2. function Economica(valor,tasa,periodo){
  3. this.valor=valor;
  4. this.tasa=tasa;
  5. this.periodo=periodo;
  6. // Este es un método que nos mostrará el resultado de la operación
  7. this.desplegarResultado=desplegarResultado;
  8. }

Ahora creamos una función para visualizar los datos:

  1. function ver(string){
  2. alert(string);
  3. }

Definimos el método "desplegarResultado"

  1. function desplegarResultado(){
  2. var valorFuturo=parseFloat(this.valor)*Math.pow(1+parseFloat(this.tasa)/100,parseInt(this.periodo));
  3. console.log("valor futuro: "+valorFuturo);
  4. var result="\n..valor: "+this.valor+" \n..tasa: "+this.tasa+" \n..periodo: "+this.periodo;
  5. result+=" \nresultado: "+valorFuturo.toString();
  6. ver(result);
  7. }

También es necesario crear un método que solicite los datos al usuario:

  1. function datos(){
  2. var valor=prompt("Valor:","");
  3. var tasa=prompt("Tasa:","");
  4. var periodo=prompt("Periodo:","");
  5.  
  6. //creamos una instancia de la "clase" Economica y le pasamos los parámetros
  7. obj1=new Economica(parseFloat(valor),parseFloat(tasa),parseInt(periodo));
  8.  
  9. //invocamos al método "desplegarResultado" para ver el resultado
  10. obj1.desplegarResultado();
  11. }

Por último creamos un botón que active el método "datos":

  1. <button onclick="javascript:datos()">Ver resultado</button>

El resultado que obtendremos por pantalla una vez que hayamos introducido el valor de la inversión, la tasa de interés y periodo o plazo de pago será el siguiente:

Vídeos sobre Javascript


Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*