Diferencia entre revisiones de «Programación en JavaScript/OOP»

Contenido eliminado Contenido añadido
Sin resumen de edición
Covi (discusión | contribs.)
m →‎Creación de funciones miembro: El código que edito no es DOM puro, al menos no estándar y utiliza métodos propietarios como el innerHTML mezclados con DOM estándar como createElement.
Línea 116:
<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 ámbito de with (que si tiene varias lineas, estas deben estar contenidas entre llaves, como for, if, etc...), y además, se pueden confundir fácilmente 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 difíciles 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.
 
Otra manera de declarar la clase en javascriptJavaScript:
 
 
<source lang="javascript">
<html>
Línea 150 ⟶ 148:
Con este ejemplo se obtiene el mismo resultado que el anterior pero el código queda un poco mas complejo. A pesar de esto ya podemos ver que a diferencia del código anterior este se encuentra encapsulado en la misma función [ ''function Persona(){}'' ]
 
Otro ejemplo de creación de una clase masmás complicado utilizando DOM estándar y JavascriptJavaScript; ''debemos recordar que innerHTML es un método propietario de Microsoft y que desaparecerá en un futuro muy próximo'':
 
<source lang="javascript">
<html>
<head>
<script language="javascript">
function CrearCapas(idcapa, info) {
this.id = idcapa;
this.texto = info;
this.CrearCapa = function CrearCapa() {
try {
try{
// Esta es la manera correcta y estándar -aunque más lenta y costosa- de generar contenido mediante el DOM:
capa=document.createElement('div');
// Objetos DOMElement necesarios:
capa.setAttribute('id',this.id);
var body = document.getElementsByTagName('body').item(0); // Tag <body> también se puede usar: ...agName('body')[0]; pero no es compatible con Opera.
document.body.appendChild(capa);
var capa = document.getElementByIdcreateElement(this.id'div'); // División al vuelo
var texto = document.createTextNode(this.texto); // Texto contenido en div al vuelo
capa.style.backgroundColor='#f7f7f7';
// Establecer atributos de división:
capa.style.width='100px';
capa.setAttribute('id', this.id);
capa.style.border='#000000 2px solid';
capa.setAttribute('style', 'background-color:#f7f7f7; width:100px; border:#000000 2px solid;');
capa.innerHTML=this.texto;
// Reconstruir el árbol DOM:
}catch(e){
capa.appendChild(texto);
alert(e.name + " - " + e.message);
document. body.appendChild(capa);
}
} }catch(e) {
}
alert(e.name + " - " + e.message);
}
}
}
</script>
Línea 186 ⟶ 185:
</source>
 
El resultado del código anterior es una paginapágina que por medio de JavascriptJavaScript crea un DIV y le asigna propiedades como ancho, alto, color, etc., y lo inserta dentro de la paginapágina al cargarse.