1
Aprender a programar desde cero / Re:Arrays asociativos Javascript Acceso propiedes notación punto ejercicio CU01146E
« en: 07 de Septiembre 2015, 08:23 »
Gracias
Si tienes algún problema para registrarte en el foro o para escribir mensajes ponte en contacto con nosotros a través del formulario de contacto de aprenderaprogramar.com
Esta sección te permite ver todos los posts escritos por este usuario. Ten en cuenta que sólo puedes ver los posts escritos en zonas a las que tienes acceso en este momento.
Define un tipo de objeto Meteorito cuyas propiedades de instancia (específicas de cada objeto) sean diametro, temperatura y nombre. La temperatura será un valor numérico que suponemos está en grados centígrados. Como propiedad estática del tipo meteorito define definicionSegunDiccionario (que debe contener la definición de meteorito) y como métodos estáticos obtenerRadio (que debe devolver el radio a partir de un parámetro diametro) y obtenerTemperaturaFarenheit (que debe devolver el valor de temperatura expresado en grados Farenheit a partir de un parámetro temperatura). Crea un objeto de tipo Meteorito con un diámetro, temperatura y nombre y comprueba que puedes acceder a las propiedades y métodos estáticos mostrando por pantalla la definición de meteorito, la superficie del objeto creado y la temperatura Farenheit del objeto creado.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
function Meteorito (diametro, temperatura, nombre) {
this.diametro=diametro;
this.temperatura=temperatura;
this.nombre=nombre;
}
Meteorito.definicionSegunDiccionario = 'Fragmento de un bólido que cae sobre la Tierra'; //Propiedad estática
Meteorito.obtenerRadio = function () {
this.radio=(this.diametro)/2;
alert('El radio es: '+this.radio);} //Método estático
Meteorito.obtenerTemperatura= function(){
this.temperaturaF=(this.temperatura)*1.8+32;
alert('La temperatura en grados Farenheit es: '+this.temperaturaF);
}
function ejemploObjetos() {
var meteo1 = new Meteorito(100, 14, 'Luna');
alert('La definicón de meteorito es: '+Meteorito.definicionSegunDiccionario);
Meteorito.obtenerRadio();
Meteorito.obtenerTemperatura();
}
</script>
</head>
<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemploObjetos()"> Probar </div>
</body>
</html>
Se pide realizar los siguientes cambios:
a) Reemplaza toda la notación basada en sintaxis tipo array para el acceso a propiedades por sintaxis basada en notación de punto. Ejecuta el código y comprueba su funcionamiento.
b) Sobre el código de la opción a), cambia la definición de objetos para que no sean objetos únicos, sino que plus, minus y calcular sean funciones simples, y operaciones un objeto instanciable (que tendrás que instanciar si es necesario). Ejecuta el código y comprueba su funcionamiento.
c) Sobre el código de la opción c), añade la posibilidad de hacer cálculos de multiplicación y división de la misma forma que se hacen cálculos de suma y resta. Muestra un mensaje por cada tipo de operación. Ejecuta el código y comprueba su funcionamiento.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<script type="text/javascript">
var plus = function(x,y){ return x + y };
var minus = function(x,y){ return x - y };
var operaciones = {
'+': plus,
'-': minus
};
var calcular = function(x, y, operacion){ return operaciones[operacion](x, y); }
function ejemploObjetos() {
alert ('Resultado de calcular(3, 15, \'+\') es '+ calcular(3,15, '+'));
}
</script>
</head>
<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemploObjetos()"> Probar </div>
</body>
</html>
Crea un objeto vacío denominado GestionDeUsuarios y añádele dos métodos: un método preguntarNombre y un método despedir. Al invocar GestionDeUsuarios.preguntarNombre(user) se debe crear un objeto de tipo usuario con id de usuario user y almacenar su nombre e id de usuario. Al invocar el método GetionDeUsuarios.despedir(user) se debe mostrar un mensaje de despedida “Hasta luego nombreDeUsuario” donde nombreDeUsuario será el nombre correspondiente.
Responde la siguiente pregunta: ¿si se crea una función despedir entrará en conflicto con el método definido?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title>
<meta charset="utf-8">
<script>
var gestionDeUsuarios={};
Object.defineProperty(gestionDeUsuarios,'usuario',{value:'Ramón'},'idUsuario',{value:'10'});
alert(gestionDeUsuarios.usuario);
gestionDeUsuarios.preguntarNombre()=function(user,idUser){
var user=prompt('Introduzca el nombre de usuario: ');
gestionDeUsuarios.usuario=user;
var idUser=prompt('Introduzca el ID de usuario: ');
gestionDeUsuarios.idUsuario=idUser;
}
gestionDeUsuarios.despedir=function(){
alert('Hasta luego ' +gestionDeUsuarios.usuario);
}
gestionDeUsuarios.preguntarNombre();
gestionDeUsuarios.despedir();
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title>
<meta charset="utf-8">
<script type="text/javascript">
function medico() {
this.nombre = "Juan Eslava";
this.personasCuradas = curarPersonas;
this.especialidad="Traumatología";
this.mostrarDatos=function(){
var msg='El médico se llama '+this.nombre;
msg=msg+', su especialidad es '+this.especialidad;
msg=msg+' y lleva curadas' +this.personasCuradas+'personas';
alert(msg);
}
}
function curarPersonas() {
var personas=7;
personas++;
return personas;
}
function ejemploCreaObjetos() {
var datos1 = new medico();
datos1.mostrarDatos();
}
</script>
</head>
<body><div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplo funciones JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemploCreaObjetos()"> Probar </div>
</body>
</html>
Define un tipo de objeto Medico en JavaScript que tenga como propiedades: nombre (String), personasCuradas (número entero), especialidad (String) y como métodos un método denominado curarPersona y otro método denominado mostrarDatos. El método curarPersona deberá añadir una unidad al valor de la propiedad personasCuradas y el método mostrarDatos deberá mostrar los datos el médico. Por ejemplo, “El médico se llama Juan Eslava, su especialidad es traumatología y lleva curadas 8 personas”. Crea dos objetos del tipo definido, e invoca sus métodos para comprobar que funcionan correctamente.
Crea un documento html con un texto en una etiqueta h1 como “Ejercicio curso aprenderaprogramar.com” y un div a continuación. Genera un script que pida cinco números al usuario usando un bucle for normal (usa prompt para pedir los datos y conviértelos a valor numérico posteriormente). Almacena los números introducidos por el usuario en un array. A continuación, accede al nodo del div y establece que muestre un texto informando del resultado de multiplicar cada uno de los números por 3 (para ello usa textContent). Ejemplo:
Al cargar la página aparecerá: Ejercicio curso aprenderaprogramar.com
… (div vacío)
Se pedirán al usuario cinco números, supongamos que introduce 1, 3, 9, 10 y 7
A continuación en la página se visualizará: Ejercicio curso aprenderaprogramar.com
Multiplicamos por 5 los números introducidos: 1*5 = 5, 3*5 = 15, 9*5 = 45, 10*5 = 50 y 7*5 =35.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo DOM - aprenderaprogramar.com</title><meta charset="utf-8">
</head>
<body>Texto en body
<div id="cabecera" class="brillante">
<h1>Portal web <span class="destacado">aprenderaprogramar.com</span>, para aprender</h1>
<img name ="lagarto" src="http://i.imgur.com/afC0L.jpg" alt="Notepad++" title="Notepad++, un útil editor de texto">
</div>
<!-- Final del código-->
<script type = "text/javascript">
var msg = '';
msg = '¿Quién es el nodo padre de document? '+ document.parentNode + '\n\n';
msg = msg + 'Para el nodo document el nodeType vale: ' + document.nodeType +' , y el nodeName vale '+ document.nodeName + '\n\n';
msg = msg+ 'El valor de nodeValue para el nodo document es: ' + document.nodeValue +'\n\n';
msg = msg + 'Nodo hijo del nodo raíz es la declaración DOCTYPE con nodeName: ' + document.childNodes[0].nodeName +'\n\n';
msg = msg + 'Nodo hijo del nodo raíz es etiqueta html con nodeName: ' + document.childNodes[1].nodeName +' y nodeType: '+ document.childNodes[1].nodeType + '\n\n';
msg = msg + 'Número de hijos de nodo etiqueta html: ' + document.childNodes[1].childElementCount +' ( ' + document.childNodes[1].children.length +')\n\n';
msg = msg + 'Nodo hijo de etiqueta html es etiqueta head con nodeName: ' + document.childNodes[1].childNodes[0].nodeName +' y nodeType: '+ document.childNodes[1].childNodes[0].nodeType +'\n\n';
msg = msg + 'Nodo hijo de etiqueta html es etiqueta body con nodeName: ' + document.childNodes[1].childNodes[1].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta body es texto <<Texto en body>> con nodeName: ' + document.childNodes[1].childNodes[1].childNodes[0].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta body es texto <<Texto en body>> con nodeValue: ' + document.childNodes[1].childNodes[1].childNodes[0].nodeValue +'\n\n';
var nodoBody = document.childNodes[1].childNodes[1];
msg = msg + '(Repetimos) Nodo hijo de etiqueta body es texto <<Texto en body>> con nodeValue: ' + nodoBody.childNodes[0].nodeValue +'\n\n';
msg = msg + 'Nodo hijo de etiqueta body es div con nodeName: ' + nodoBody.childNodes[1].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta div es texto vacío (salto de línea) con nodeName: ' + nodoBody.childNodes[1].childNodes[0].nodeName +' y nodeValue ' + nodoBody.childNodes[1].childNodes[0].nodeValue + '\n\n';
msg = msg + 'Nodo hijo de etiqueta div es etiqueta H1 con nodeName: ' + nodoBody.childNodes[1].childNodes[1].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta h1 es texto con nodeName: ' + nodoBody.childNodes[1].childNodes[1].childNodes[0].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta h1 es etiqueta span con nodeName: ' + nodoBody.childNodes[1].childNodes[1].childNodes[1].nodeName +'\n\n';
var nodoSpan = nodoBody.childNodes[1].childNodes[1].childNodes[1];
msg = msg + 'Nodo hijo de etiqueta span es texto con nodeName: ' + nodoSpan.childNodes[0].nodeName +' y nodeValue: '+ nodoSpan.childNodes[0].nodeValue +'\n\n';
msg = msg + 'Nodo hijo de etiqueta h1 es texto con nodeName: ' + nodoBody.childNodes[1].childNodes[1].childNodes[2].nodeName +' y nodeValue: '+ nodoBody.childNodes[1].childNodes[1].childNodes[2].nodeValue +'\n\n';
msg = msg + 'Nodo hijo de etiqueta div es texto vacío (salto de línea) con nodeName: ' + nodoBody.childNodes[1].childNodes[2].nodeName +'\n\n';
msg = msg + 'Nodo hijo de etiqueta div es img con nodeName: ' + nodoBody.childNodes[1].childNodes[3].nodeName +'\n\n';
msg = msg + 'Valor del atributo name de la imagen: ' + nodoBody.childNodes[1].childNodes[3].name +'\n\n';
var nodoImg = nodoBody.childNodes[1].childNodes[3];
msg = msg + 'Valor del atributo src de la imagen: ' + nodoImg.src +', valor de alt: ' + nodoImg.alt + '\n\n';
msg = msg + 'Valor del atributo title de la imagen: '+ nodoImg.title+'\n\n';
msg = msg + 'Nodo hijo de etiqueta body es texto vacío (salto de línea) con nodeName: ' + nodoBody.childNodes[2].nodeName +' y nodeType: '+nodoBody.childNodes[2].nodeType+' \n\n';
msg = msg + 'Nodo hijo de etiqueta body es comentario con nodeName: ' + nodoBody.childNodes[3].nodeName +' y nodeType: '+nodoBody.childNodes[3].nodeType+' y nodeValue: '+nodoBody.childNodes[3].nodeValue+' \n\n';
alert (msg);
</script>
</body>
</html>
Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.
Abraham Lincoln (1808-1865) Presidente estadounidense.
aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación