Ejercicios resueltos de JavaScript - Página 4

Curso de JavaScript desde cero a máster

En esta página tienes numeradas todas las soluciones a los ejercicios realizados durante todo el curso. Si te quedan dudas o tienes un resultado diferente, déjame un comentario, ya que a veces, un ejercicio puede tener muchas posibles soluciones.

Soluciones de ejercicios JavaScript - Página 4

    Capítulo 31

  1. Solo tienes que cambiar el alert() por un document.write(). Un ejercicio tan fácil que parece con trampa, pero no la hay. Lo único que pretendía con este ejercicio es que hayas comprendido que puedes ejecutar el código que quieras desde un evento.

    2. Etiquetas html 

    <!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>Introducción a los eventos</title>
	<script src="test.js"></script>
	<link href="test.css" rel="stylesheet" />
</head>

<body>
	<button onclick="document.write('¡Has pulsado el botón!');">¡NO PULSAR!</button>
</body>
</html>

    Capítulo 32

  2. Solo tienes que cambiar el alert() por un document.write(). Un ejercicio tan fácil que parece con trampa, pero no la hay. Lo único que pretendía con este ejercicio es que hayas comprendido que puedes ejecutar el código que quieras desde un evento.

    3. Código JavaScript 

    let vehiculo = {
	marca: 'Opel',
	color: 'negro',
	numeroRuedas: 4,
	numeroPlazas: 5,
	tipo: 'deportivo',
	precio: 10000,
};

    Capítulo 33

  3. Lo importante de este ejercicio es que sepas acceder y presentar las propiedades de los objetos.

    4. Código JavaScript 

    let vehiculo = {
	marca: 'Opel',
	color: 'negro',
	numeroRuedas: 4,
	numeroPlazas: 5,
	tipo: 'deportivo',
	precio: 10000,
};

alert('El vehículo con marca ' + vehiculo.marca + ' de color ' + vehiculo.color + ' tiene un coste de ' + vehiculo.precio + ' $.')

    terminal Resultado en el alert() terminal

    El vehículo con marca Opel de color negro tiene un coste de 10000 $.

    Capítulo 34

  4. En este ejercicio solo tenías que observar para contestar las siguientes preguntas.
  5. Este objeto está pensado meramente para comprobar que has comprendido como funcionan los espacios de nombres. El código es totalmente incorrecto en el sentido de las buenas prácticas. Sin embargo, no contiene errores sintácticos.
    Como puedes ver, es confuso al utilizar los mismos nombres de propiedad en un mismo objeto. Sin embargo, lo he hecho para que puedas apreciar los diferentes espacios de nombres.
  6. El valor 'azul' pertenece a la propiedad color3 del espacio de nombres (objeto en este caso) colores.

    7. Código JavaScript 

    console.log(colores.color3)

    terminal Resultado en la consola terminal

    "azul"
  7. El valor 'naranja' pertenece a la propiedad color1 del espacio de nombres (objeto) secundarios que es una propiedad del espacio de nombres (objeto) colores.

    8. Código JavaScript 

    console.log(colores.secundarios.color1)

    terminal Resultado en la consola terminal

    "naranja"
  8. El valor 'rojo-púrpura' pertenece a la propiedad color5 del espacio de nombres (objeto) terciarios que es una propiedad del espacio de nombres (objeto) secundarios que este a su vez, es una propiedad del espacio de nombres (objeto) colores.

    9. Código JavaScript 

    console.log(colores.secundarios.terciarios.color5)

    terminal Resultado en la consola terminal

    "rojo-púrpura"

    Capítulo 35

  9. Tienes que crear la propiedad telefono3 con la que poder añadir un tercer teléfono.

    10. Código JavaScript 

    usuario.telefonos.telefono3 = "0489070688";
console.log(usuario);

    terminal Resultado en la consola terminal

    	edad: 30,
	idiomas: ["Español", "Catalán", "Inglés", "Portugués", "Italiano"],
	nombre_completo: ["Enrique", "Barros", "Fernández"],
	pais_residencia: "Australia",
	telefonos: {
		telefono1: "0467489304",
		telefono2: "0446395860",
		telefono3: "0489070688"
	}
}
  10. Para modificar el array es lo mismo con con cualquier otro valor, una reasignación.

    11. Código JavaScript 

    usuario.nombre_completo = ['Nombre', 'apellido1', 'apellido2'];

console.log(usuario);

    terminal Resultado en la consola terminal

    {
	edad: 30,
	idiomas: ["Español", "Catalán", "Inglés", "Portugués", "Italiano"],
	nombre_completo: ["Nombre", "apellido1", "apellido2"],
	pais_residencia: "Australia",
	telefonos: {
		telefono1: "0467489304",
		telefono2: "0446395860"
	}
}
  11. Este ejercicio era para ponerte a prueba. Si no lo conseguiste sin mirar la solución no pasa nada, con que entiendas como se hace para la próxima puedes dar el ejercicio por completado.
    Cuando dimos el tema de los array, te enseñé a reasignar el valor de una posición del array. Esto es lo mismo solo que tenías que aplicarlo al namespace del objeto usuario.

    12. Código JavaScript 

    usuario.idiomas[4] = 'Francés';

console.log(usuario);

    terminal Resultado en la consola terminal

    {
	edad: 30,
	idiomas: ["Español", "Catalán", "Inglés", "Portugués", "Francés"],
	nombre_completo: ["Enrique", "Barros", "Fernández"],
	pais_residencia: "Australia",
	telefonos: {
		telefono1: "0467489304",
		telefono2: "0446395860"
	}
}

    Capítulo 36

  12. No había explicado como hacerlo, pero si lo has conseguido, enhorabuena.
    Se trata de indicarle la posición a eliminar del array.
    13. let usuario = {
	nombre_completo: ['Enrique', 'Barros', 'Fernández'],
	edad: 30,
	telefonos : {
		telefono1: '0467489304',
		telefono2: '0446395860'
		},
	pais_residencia: 'Australia',
	idiomas: ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'],
};

delete usuario.nombre_completo[2];

console.log(usuario.nombre_completo);

    terminal Resultado en la consola terminal

    En lugar de eliminar la posición, elimina el valor y deja una posición vacía.

    ['Enrique', 'Barros', vacío]

    Capítulo 37

    Este capítulo no tiene ejercicios.

    Capítulo 38

  13. Aquí, simplemente tenías que instanciar un objeto de la función constructora del capítulo. Es un ejercicio solo para que practiques.

    14. Código JavaScript 

    let usuario3 = new Usuario(
	'Ramiro',
	'Beltrán Calderón',
	54,
	'657483920',
	'España',
	['español', 'inglés']
);

    Capítulo 39

  14. Solo hay que indicar el nombre del objeto seguido de la propiedad edad.

    15. Código JavaScript 

    console.log(usuario2.edad);

    terminal Resultado en la consola terminal

    24
  15. Aquí pido la posición 2 que no es lo mismo que la segunda posición.

    16. Código JavaScript 

    console.log(usuario1.idiomas[2]);

    terminal Resultado en la consola terminal

    inglés
  16. En este ejercicio te he pedido añadir dos propiedades nuevas. Si las has inicializado dándoles un valor también está correcto.

    17. Código JavaScript 

    usuario1.direccion;
usuario1.biografia;
  17. Elimino la propiedad edad de ambos usuarios.

    18. Código JavaScript 

    delete usuario1.edad;
delete usuario2.edad;

    Capítulo 40

  18. Este ejercicio se puede realizar de muchas formas. Lo que quiero en sí, es que sepas crear y manejar métodos en las funciones constructoras. Si lo hiciste más elaborado, perfecto.

    19. Código JavaScript 

    this.muestraIdiomas = function() {
	console.log(this.nombre_completo.nombre + " habla " + this.idiomas + '.');
}

    Ten en cuenta, si has intentado mejorar la presentación del console.log(), que no es correcto si has puesto manualmente las posiciones del array. Ya que un objeto puede tener un array de 5 posiciones y otro de 3 o el número que sea. Cuando trabajas con funciones constructoras, tienes que pensar en dinámico y no en estático.

    Código JavaScript incorrecto

    this.muestraIdiomas = function() {
	console.log(this.nombre_completo.nombre
	+ " habla "
	+ this.idiomas[0]
	+ ', '
	+ this.idiomas[1]
	+ ', '
	+ this.idiomas[2]
	+ ', '
	+ this.idiomas[3]
	+ ', '
	+ this.idiomas[4]
	+ '.');
}

    terminal Resultado en la consola terminal

    Enrique habla español, catalán, inglés, portugués, italiano.

    Aunque funciona con usuario1, no lo hace con un usuario que tuviera más o menos posiciones en el array. La salida en la consola, sería así:

    terminal Resultado en la consola terminal

    Andrea habla español, portugués, inglés, undefined, undefined.

    Para hacerlo correctamente, por ejemplo, podrías crear un pequeño bucle que itere las posiciones del array. Ya veremos como hacer esto, no importa que te mates a intentarlo.
    De todas formas, si no sabes si está bien como lo hayas hecho, me puedes dejar un comentario con el código y me lo miro.

  19. A partir de la plantilla Usuario (objeto literal) se crea la instancia con create(). Después, le damos las propiedades y métodos que queramos. En este caso, bastaba solo con las propiedades de la plantilla.

    20. Código JavaScript

    let Usuario = {
	nombre: null,
	edad: null,
	telefono: null,
	paisResidencia: null,
	idiomas: [],
};

let usuario1 = Object.create(Usuario);

usuario1.nombre = "Enrique";
usuario1.edad = 30;
usuario1.telefono = "0467489304";
usuario1.paisResidencia = "Australia";
usuario1.idiomas = ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano'];

console.log(usuario1);

    terminal Resultado en la consola terminal

    edad: 30
idiomas: (5) ['Español', 'Catalán', 'Inglés', 'Portugués', 'Italiano']
nombre: "Enrique"
paisResidencia: "Australia"
telefono: "0467489304"
  20. Bueno, este ejercicio es como el 85. Únicamente es para que practiques un poco más con tus propios datos. Repito aquí también, que por tu privacidad, no lo publiques en los comentarios.

Páginas

Suscríbete a mi canal de YouTube para apoyarme

Si te ha gustado este curso y crees que el trabajo merece la pena, te agradeceré eternamente que te suscribas a mi canal de YouTube para apoyarme y que pueda seguir haciendo cursos gratuitos.

Además, si te encanta la programación, tienes un montón más de cursos gratuitos para ver.

No solo eso, podrás participar enviándome comentarios con tus sugerencias para temas específicos o cursos completos o incluso las dudas que tengas y las intentaré ir resolviendo en los cursos que estén todavía abiertos.

Comentarios

Si te quedan dudas sobre el temario, sobre JavaScript, o cualquier otra cosa relacionada o simplemente quieres agradecer, aquí tienes tu sitio para dejar tu granito de arena. Gracias por tus comentarios y por darle vida a este sitio web.