Autor Tema: Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E (Leído 3186 veces)

Salvadoruve2 · « **en:** 01 de Agosto 2016, 21:11 »

Ejercicios del curso básico de desarrollo web con JavaScript desde cero.

Ejercicio 1.

Hola he resuelto el ejercicio y no estoy muy serguro de haberlo hecho correctamente.

He conseguido que un objeto herede propiedades comunes y propiedades especificas de otros supertipos.. Pero lo que no he logrado es que los atributos tambien se hereden. He tenido que repetir el atributo de "nacionalidad" en la invocación de Médico y de médico especialista para conseguir hacer funcionar el programa.

No se si eso es correcto o hay una mejor forma de llevarlo a cabo.

Aquí mi propuesta

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
	<title>Herencia prototype</title>
	<meta charset="utf-8">
	<style type="text/css">
		body {text-align: center; margin: 0 auto;}
		div {padding:15px; width: auto; display: inline-block; margin: 25px; margin-top: 300px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
		div:hover, div:hover {background: rgb(66, 184, 221);}
	</style>
	<script type="text/javascript">


		function Persona(nacionalidad) {
			this.nombre = 'Marco';
			this.nacionalidad = nacionalidad;
		}

		Persona.prototype.mostrarNAcionalidad = function() {alert('La nacionalidad del médico es ' + this.nacionalidad);}

		

		function Medico(institucion,nacionalidad) {
			Persona.call(this,nacionalidad);
			this.institucion = institucion || 'Desconocida';

			}


		Medico.prototype = new Persona();		


		function MedicoEspecialista(especialidad,nacionalidad) {
			Persona.call(this, nacionalidad);
			this.especialidad = especialidad;			
		}

		MedicoEspecialista.prototype = new Medico();	


		function start() {
			var tipo = new Persona();

			var profesion = new Medico('Hospital Central','Chilena');

			alert('La nacionalidad del medico es ' + profesion.nacionalidad);		

			var cardiologo = new MedicoEspecialista('cardiología','Chilena');

			alert('La institucion es ' + profesion.institucion);

			cardiologo.mostrarNAcionalidad();
			
		}

	</script>
</head>
<body>
<div onclick="start()">Herencia</div>
</body>
</html>

PD: el ejercicio dos pensaba terminarlo cuando tuviera primero estos conceptos claros. Gracias

Salvadoruve2 · « **Respuesta #1 en:** 02 de Agosto 2016, 11:28 »

Vale ya he logrado resolver los problemas que tenía.. aquí dejo las dos soluciones a los dos ejercicios. Espero haberlo resuelto correctamente.

Ejerciccio 1

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
	<title>Herencia prototype</title>
	<meta charset="utf-8">
	<style type="text/css">
		body {text-align: center; margin: 0 auto;}
		div {padding:15px; width: auto; display: inline-block; margin: 25px; margin-top: 300px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
		div:hover, div:hover {background: rgb(66, 184, 221);}
	</style>
	<script type="text/javascript">


		function Persona(nacionalidad) {
			this.nombre = 'Marco';
			this.nacionalidad = nacionalidad;
		}

		Persona.prototype.mostrarNAcionalidad = function() {alert('La nacionalidad del médico es ' + this.nacionalidad);}

		

		function Medico(institucion) {
			this.institucion = institucion || 'Desconocida';
			}


		Medico.prototype = new Persona();		


		function MedicoEspecialista(especialidad,nacionalidad,institucion) {
			Persona.call(this,nacionalidad);
			Medico.call(this.institucion);
			this.especialidad = especialidad;			
		}

		MedicoEspecialista.prototype = new Medico();	


		function start() {	

			var cardiologo = new MedicoEspecialista('cardiología','Chilena', 'institucion');

			cardiologo.mostrarNAcionalidad();
			
		}

	</script>
</head>
<body>
<div onclick="start()">Herencia</div>
</body>
</html>

Ejercicio 2

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
	<title>Herencia prototype</title>
	<meta charset="utf-8">
	<style type="text/css">
		body {text-align: center; margin: 0 auto;}
		div {padding:15px; width: auto; display: inline-block; margin: 25px; margin-top: 300px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
		div:hover, div:hover {background: rgb(66, 184, 221);}
	</style>
	<script type="text/javascript">

	function Persona (nombre) { 
		this.nombre = nombre;

		this.saludar = function () {alert('Hola, soy ' + this.nombre);}

	}

	Persona.prototype.saludar = function() {alert('Hola, soy ' + this.nombre);}

	Persona.prototype.definicion = 'Ser humano'; 


	function Profesor(institucionAcademica) {
		this.institucionAcademica = institucionAcademica;
	}

	function ProfesorTitular (añosTrabajados,institucionAcademica,nombre) {
		this.añosTrabajados = añosTrabajados;
		Profesor.call(this,institucionAcademica);
		Persona.call(this,nombre);
	}

	ProfesorTitular.prototype = new Persona();

	function ProfesorInterino(mesesTrabajados) {
		this.mesesTrabajados = mesesTrabajados;
	}

	function start() {
		var profesorTitular1 = new ProfesorTitular(8,'Universidad de León','Juan' );
		var profesorInterino1 = new ProfesorInterino(6);

		profesorTitular1.saludar();
	}


	</script>
</head>
<body>
<div onclick="start()">Herencia2</div>
</body>
</html>

Mario R. Rancel · « **Respuesta #2 en:** 05 de Agosto 2016, 15:02 »

Buenas tardes,

Para seguir el esquema de herencia propuesto en el ejercicio 1, un médico especialista debe invocar a Medico, y Medico debe invocar a Persona (yendo así de lo más particular a lo más general), como está realizado en el ejercicio https://www.aprenderaprogramar.com/foros/index.php?topic=3390.0

No obstante en tu ejercicio el médico especialista invoca a Persona:

Código: [Seleccionar]

function MedicoEspecialista(especialidad,nacionalidad,institucion) {
	Persona.call(this,nacionalidad);
	Medico.call(this.institucion);
	this.especialidad = especialidad;			
}

Eso no parece la forma más correcta de reflejar el esquema de herencia.

En el ejercicio 2 ocurriría algo parecido: un profesor interino debe invocar a Profesor, y Profesor debe invocar a Persona y así sucesivamente.

No obstante en tu código el profesor interino no invoca a ninguna entidad superior:

Código: [Seleccionar]

	function ProfesorInterino(mesesTrabajados) {
		this.mesesTrabajados = mesesTrabajados;
	}

Mientras que ProfesorTitular invoca tanto a Profesor como a Persona:

Código: [Seleccionar]

	function ProfesorTitular (añosTrabajados,institucionAcademica,nombre) {
		this.añosTrabajados = añosTrabajados;
		Profesor.call(this,institucionAcademica);
		Persona.call(this,nombre);
	}

Todo esto tendrías que organizarlo de modo que el código refleje los esquemas de herencia que se plantean.

Saludos

Salvadoruve2 · « **Respuesta #3 en:** 06 de Agosto 2016, 12:08 »

Hola gracias por la respuesta.

Es cierto que modifiqué las herencias para comprobar si podía obtener información tanto como de un supertipo inmediato como del supertipo siguiente.

En el ejercicio 2 no definí a ProfesorInterino por que no lo pedían en el enunciado, pero y alo he hecho.

Aquí dejo corregidos ambos ejercicios.

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
	<title>Herencia prototype</title>
	<meta charset="utf-8">
	<style type="text/css">
		body {text-align: center; margin: 0 auto;}
		div {padding:15px; width: auto; display: inline-block; margin: 25px; margin-top: 300px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
		div:hover, div:hover {background: rgb(66, 184, 221);}
	</style>
	<script type="text/javascript">


		function Persona(nacionalidad) {
			this.nombre = 'Marco';
			this.nacionalidad = nacionalidad;
		}

		Persona.prototype.mostrarNAcionalidad = function() {alert('La nacionalidad del médico es ' + this.nacionalidad);}

		

		function Medico(institucion,nacionalidad) {
			Persona.call(this, nacionalidad);
			this.institucion = institucion || 'Desconocida';
			}


		Medico.prototype = new Persona();		


		function MedicoEspecialista(especialidad,nacionalidad,institucion) {
			Medico.call(this, institucion, nacionalidad);
			this.especialidad = especialidad;			
		}

		MedicoEspecialista.prototype = new Medico();	


		function start() {	

			var cardiologo = new MedicoEspecialista('cardiología','Chilena', 'institucion');

			cardiologo.mostrarNAcionalidad();
			
		}

	</script>
</head>
<body>
<div onclick="start()">Herencia</div>
</body>
</html>

Código: [Seleccionar]

<!DOCTYPE html>
<html>
<head>
	<title>Herencia prototype</title>
	<meta charset="utf-8">
	<style type="text/css">
		body {text-align: center; margin: 0 auto;}
		div {padding:15px; width: auto; display: inline-block; margin: 25px; margin-top: 300px; cursor: pointer; color: white; border-radius: 40px; background: rgb(202, 60, 60);}
		div:hover, div:hover {background: rgb(66, 184, 221);}
	</style>
	<script type="text/javascript">

	function Persona (nombre) { 
		this.nombre = nombre;

		this.saludar = function () {alert('Hola, soy ' + this.nombre);}

	}

	Persona.prototype.saludar = function() {alert('Hola, soy ' + this.nombre);}

	Persona.prototype.definicion = 'Ser humano'; 


	function Profesor(institucionAcademica,nombre) {
		this.institucionAcademica = institucionAcademica;
		Persona.call(this, nombre);
	}

	Profesor.prototype = new Persona();

	function ProfesorTitular (añosTrabajados,institucionAcademica,nombre) {
		this.añosTrabajados = añosTrabajados;
		Profesor.call(this, institucionAcademica, nombre);
	}

	ProfesorTitular.prototype = new Profesor();

	function ProfesorInterino(mesesTrabajados, institucionAcademica, nombre) {
		this.mesesTrabajados = mesesTrabajados;
		Profesor.call(this, institucionAcademica, nombre);
	}

	ProfesorInterino.prototype = new Profesor();

	function start() {
		var profesorTitular1 = new ProfesorTitular(8,'Universidad de León','Juan' );
		var profesorInterino1 = new ProfesorInterino(6,'Universidad de León','Pedro');

		profesorTitular1.saludar();
	}


	</script>
</head>
<body>
<div onclick="start()">Herencia2</div>
</body>
</html>

Saludos!!

Mario R. Rancel · « **Respuesta #4 en:** 09 de Agosto 2016, 21:33 »

Buenas tardes Salvador, creo que has resuelto bien los ejercicios. En el ejercicio 1 ya la cadena de herencia sigue una lógica, y también en el ejercicio 2.

En el ejercicio 1 he visto estos detalles:

Persona.prototype.mostrarNAcionalidad = function() {alert('La nacionalidad del médico es ' + this.nacionalidad);}

Sería: Persona.prototype.mostrarNAcionalidad = function() {alert('La nacionalidad de la persona es ' + this.nacionalidad);}

ya que es referido a una persona.

La definición de persona que has hecho como

function Persona(nacionalidad) {
         this.nombre = 'Marco';
         this.nacionalidad = nacionalidad;
      }

Sería más lógico que se recibiera el nombre también como parámetro, ya que en caso contrario sería como estar diciendo que "todas las personas se llaman Marco".

En general si ves otros hilos del foro verás que recomendamos no usar eñes en nombres de variables o funciones para evitar problemas de compatibilidad de juegos de caracteres (por ejemplo en lugar de añosTrabajados usar annosTrabajados).

Saludos.

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias:

Autor Tema: Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E (Leído 3186 veces)

Salvadoruve2

Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E

Salvadoruve2

Re:(CU01150E) call JavaScript. Diferencia con apply. Constructores con he.resuelto

Mario R. Rancel

Re:Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E

Salvadoruve2

Re:Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E

Mario R. Rancel

Re:Ejemplo call JavaScript Diferencia con apply Constructores con herencia CU01150E

Preguntas y respuestas