Comunidad de diseño web y desarrollo en internet online

Clases y objetos en JavaScript

Citar            
MensajeEscrito el 16 Jun 2008 11:47 pm
Saludos.
Soy nuevo en el manejo de las clases de javascript.
Siempre las he evitado, y he hecho todo de "otra manera"

Pero me he puesto, y me asalta una duda.
A ver si se puede, o no.

Hasta donde sé, la clase "Date", funciona de esta manera:
RR=new Date;
alert(RR.getHour) //devuelve el método "getHour()"
alert(RR) //devuelve el string de la hora/fecha completa.'


Entonces, querría disponer de una clase "animal", que trabajara de forma parecida.
//constructor
function animal(p,c)
{this.patas=p;
this.cola=c;
this='por_defecto' //quisiera que hubiera una propiedad 'default'
}
//creamos 'gato'
gato=new animal(4,true);
alert(gato.patas) //devuelve '4'
alert(gato) //quisiera que devolviera la propiedad por 'default'


¿Motivo?
Quiero poder programar algo parecido al $(id), de Mootools (o jQuery).
Que si se ejecuta "$(id)", devuelve un [DOM_ELEMENT]
Pero que también admite, "$(id).metodo(params)"
(Esto último, quizá no tenga que ver con el manejo de las "clases"; aún así, me gustaría conocer ambas cuestiones, o al menos, la primera de las planteadas)



Gracias!

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 17 Jun 2008 05:04 am

Código :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <title>Untitled Document</title>
   </head>
   <body>
   <script>
      
      /* Constructor*/
      function Animal ()
      {
         alert("let it blank intentionally");
         
      }
      
      Animal.prototype = 
      {
         // properties
         color: "",
         type: "",
         
         // methods
         setColor:function(color)
         {
            this.color = color;
         },
         
         setType:function(type)
         {
            this.type = type;
         },
         
         getColor:function()
         {
            return this.color;
         },
         
         getType:function()
         {
            return this.type;
         }
      }
      
      function $ (id)
      {
         return document.getElementById(id);
      }
      function testAnimal()
      {
         var myAnimal = new Animal()
         myAnimal.setColor("amarillo");
         myAnimal.setType("tigre");
         
         alert(myAnimal.getType());
         alert(myAnimal.getColor());
      }
   </script>
   
   <input type="button"  id="myButton" onclick="alert($(this.id).value);" value="Click me!" />
   <input type="button" id="myAnimal" onclick="testAnimal();" value="Test Animal" />
   
   </body>
</html>

Por Maikel

BOFH

5575 de clabLevel

22 tutoriales
5 articulos

Genero:Masculino   Team Cristalab

Claber de baja indefinida

firefox
Citar            
MensajeEscrito el 17 Jun 2008 11:23 am
Gracias Maikel por el código.
Manera mucho más bonita de general la clase.

Pero veamos.
Hago la siguiente modificación:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<script>

/* Constructor*/
function Animal ()
{alert("let it blank intentionally");}

Animal.prototype =
{type: "",

setType:function(type)
{this.type = type;},

getType:function()
{return this.type;}
}

var myAnimal;
function testAnimal()
{myAnimal = new Animal()
myAnimal.setType("tigre");

alert(myAnimal.getType());
}
</script>

<input type="button" id="myAnimal" onclick="testAnimal(); myAnimal;" value="Test Animal" />

</body>
</html>

Ahora bien:
Si ejecutas:
javascript:myAnimal
Querría que devolviera:
alert("let it blank intentionally");
Pero no ocurre. Devuelve:
[objet]


En cambio:
Si tienes:
"TIME=new Date()"
y le pides "TIME" (sin pedir método ni propiedad), te devuelve un valor (el string de fecha/hora GMT), y no "[OBJECT]"

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 17 Jun 2008 05:01 pm
agrega

Código :

toString:function()
{
   return "I Am Animal!";   
}


y listo

Por Maikel

BOFH

5575 de clabLevel

22 tutoriales
5 articulos

Genero:Masculino   Team Cristalab

Claber de baja indefinida

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.