Diferencia entre revisiones de «Programación en JavaScript/OOP»
Contenido eliminado Contenido añadido
m →Creación de funciones miembro: <source /> |
|||
Línea 43:
Hasta ahora hemos visto como crear propiedades de las clases, pero necesitamos crear código en ese objeto que utilice las propiedades que hemos creado en el constructor. Para crear una función miembro, debemos indicarlo en la propia función de construccion:
<source lang="javascript">
function Persona(nombre) {
this.nombre = nombre;
Línea 51 ⟶ 52:
this.dormir = dormir; // Nueva función miembro
}
</source>
Y ahora definimos la función dormir:
<source lang="javascript">
function dormir() {
alert(this.nombre + ' está durmiendo');
}
</source>
Fijémonos en la función. Tiene una forma bastante normal. Lo único especial que hemos hecho es añadir la linea
<source lang="javascript">
this.dormir = dormir;
</source>
al constructor, con lo que hemos asignado la función dormir como si fuera una propiedad. Recordemos que TODO es un objeto en JavaScript, y esto incluye a las funciones. Ahora, para ejecutar este código, utilizamos el objeto anteriormente creado para ponerlo en marcha:
<source lang="javascript">
hombre.dormir();
</source>
Veamos en un ejemplo todo el código que hemos generado hasta ahora:
<source lang="javascript">
<html>
<head>
Línea 95 ⟶ 104:
</body>
</html>
</source>
Como resultado, nos mostrará el mensaje "Pepe está durmiendo". Como vemos, podemos usar las propiedades de los objetos dentro de las funciones miembro, aunque también podríamos construir la misma funcion de otra manera:
<source lang="javascript">
function dormir() {
with (this)
alert(nombre + ' está durmiendo');
}
</source>
<code>with</code> es una palabra reservada de JavaScript que permite coger una variable de objeto como this y permite utilizar sus miembros como si fueran variables independientes. Pero tiene sus restricciones: estos nombres abreviados sólo se pueden utilizar dentro del ambito de with (que si tiene varias lineas, estas deben estar contenidas entre llaves, como for, if, etc...), y además, se pueden confundir facilmente con variables locales a la función o globales del programa, con lo cual particularmente no recomendamos el uso de with, ya que puede dar lugar a fallos de ejecución dificiles de tratar si no se tienen en cuenta estas restricciones. Se aconseja usar la forma this.nombre. También se recomienda crear cada clase en un archivo diferente para que no haya confusiones de nombres, sobre todo de funciones miembro.
Línea 108 ⟶ 120:
<source lang="javascript">
<html>
<head>
Línea 133 ⟶ 146:
</body>
</html>
</source>
Línea 141 ⟶ 154:
<source lang="javascript">
<html>
<head>
Línea 171 ⟶ 185:
</body>
</html>
</source>
El resultado del codigo anterior es una pagina que por medio de Javascript crea un DIV y le asigna propiedades como ancho,alto,color etc. y lo inserta dentro de la pagina al cargarse.
| |||