Autor Tema: Prototype JavaScript. Explicación de la herencia propiedades y métodos CU01147E  (Leído 1583 veces)

DRANXZ88

  • Avanzado
  • ****
  • Mensajes: 356
    • Ver Perfil
Propuesta de solución del ejercicio CU01147E del tutorial de programación web con JavaScript de aprenderaprogramar.


Código html

Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Ejercicios (CU01147E)</title>
<link rel="stylesheet" href="css/estilos47.css">
</head>
<body>
<section>
<div>
<button onclick="cargarCometa();">Cargar valor de las cometas</button>
</div>
</section>
<script type="text/javascript" src="js/funciones47.js"></script>
</body>
</html>


Código CSS
Código: [Seleccionar]
body{
background: green;
font-family: Arial, Helvetica, sans-serif;
}
button{
background-color:blue;color:white;width:120px;
border-radius: 5px;
}


Código JavaScript

Código: [Seleccionar]
function cometa(diametro, temperatura, nombre){
this.diametro = diametro;
this.temperatura = temperatura;
this.nombre = nombre;
this.radio=0;
this.farenheit=0;
}

function prototipoCometa(){
this.definicionSegunDiccionario = 'Astro formado por un núcleo poco denso y una cola o cabellera luminosa, que describe una órbita muy excéntrica, visible cuando se aproxima al Sol';
this.obtenerRadio = function (){
this.radio = this.diametro/2;
};
this.obtenertemperaturaFarenheit = function(){
this.farenheit = (this.temperatura * 9/5) + 32;
};
}
cometa.prototype = new prototipoCometa();
function cargarCometa(){
var cometa1 = new cometa(50000,32,'Halley');
var cometa2 = new cometa(30000,22,'Shoemaker-Levy 9');
var cometa3 = new cometa(10000,12,'Hale-Bopp');
cometa1.obtenerRadio();
cometa1.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa1.definicionSegunDiccionario+' El cometa1 su nombre es '+cometa1.nombre+' tiene un diametro de '+cometa1.diametro+
' con una temperatura de '+cometa1.temperatura+'°C'+' con un radio de '+ cometa1.radio+' y temperatura farenheit '+cometa1.farenheit+' °F');
cometa2.obtenerRadio();
cometa2.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa2.definicionSegunDiccionario+' El cometa2 su nombre es '+cometa2.nombre+' tiene un diametro de '+cometa2.diametro+
' con una temperatura de '+cometa2.temperatura+'°C'+' con un radio de '+ cometa2.radio+' y temperatura farenheit '+cometa2.farenheit+' °F');
cometa3.obtenerRadio();
cometa3.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa3.definicionSegunDiccionario+' El cometa3 su nombre es '+cometa3.nombre+' tiene un diametro de '+cometa3.diametro+
' con una temperatura de '+cometa3.temperatura+'°C'+' con un radio de '+ cometa3.radio+' y temperatura farenheit '+cometa3.farenheit+' °F');

}
« Última modificación: 11 de Junio 2020, 17:38 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Buenas, para quien revise este ejercicio decir que está bien resuelto y es un buen ejemplo de herencia en JavaScript con prototype. El código anterior hay que montarlo en archivos para que funcione. Para que resulte más fácil de probar lo dejo aquí todo unido para que pueda probarse con un solo archivo:

Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Ejercicios (CU01147E) </title>
<style type="text/css">
body{
background: green;
font-family: Arial, Helvetica, sans-serif;
}
button{
margin: 100px;
background-color:blue;color:white;width:120px;
border-radius: 5px;
}
</style>
<script type="text/javascript">
function cometa(diametro, temperatura, nombre){
this.diametro = diametro;
this.temperatura = temperatura;
this.nombre = nombre;
this.radio=0;
this.farenheit=0;
}

function prototipoCometa(){
this.definicionSegunDiccionario = 'Astro formado por un núcleo poco denso y una cola o cabellera luminosa, que describe una órbita muy excéntrica, visible cuando se aproxima al Sol';
this.obtenerRadio = function (){
this.radio = this.diametro/2;
};
this.obtenertemperaturaFarenheit = function(){
this.farenheit = (this.temperatura * 9/5) + 32;
};
}
cometa.prototype = new prototipoCometa();
function cargarCometa(){
var cometa1 = new cometa(50000,32,'Halley');
var cometa2 = new cometa(30000,22,'Shoemaker-Levy 9');
var cometa3 = new cometa(10000,12,'Hale-Bopp');
cometa1.obtenerRadio();
cometa1.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa1.definicionSegunDiccionario+' El cometa1 su nombre es '+cometa1.nombre+' tiene un diametro de '+cometa1.diametro+
' con una temperatura de '+cometa1.temperatura+'°C'+' con un radio de '+ cometa1.radio+' y temperatura farenheit '+cometa1.farenheit+' °F');
cometa2.obtenerRadio();
cometa2.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa2.definicionSegunDiccionario+' El cometa2 su nombre es '+cometa2.nombre+' tiene un diametro de '+cometa2.diametro+
' con una temperatura de '+cometa2.temperatura+'°C'+' con un radio de '+ cometa2.radio+' y temperatura farenheit '+cometa2.farenheit+' °F');
cometa3.obtenerRadio();
cometa3.obtenertemperaturaFarenheit();
alert('La definición segun diccionario es '+cometa3.definicionSegunDiccionario+' El cometa3 su nombre es '+cometa3.nombre+' tiene un diametro de '+cometa3.diametro+
' con una temperatura de '+cometa3.temperatura+'°C'+' con un radio de '+ cometa3.radio+' y temperatura farenheit '+cometa3.farenheit+' °F');

}
</script>
</head>
<body>
<section>
<div>
<button onclick="cargarCometa();">Cargar valor de las cometas</button>
</div>
</section>
<script type="text/javascript" src="js/funciones47.js"></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

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".