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
Aprende Joomla con el libro "Creación y administración web con Joomla. Curso paso a paso" 2ª Edición. 168 pgs. Editorial aprenderaprogramar.com. Disponible en formato papel y ebook.
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