Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
5
respuestas

[Duda] [Duda] Desafio: Hora de practicar - Logica de programacion: explorar funciones y listas

DUDA: este es mi código, sin embargo al correr el programa solo sirve el boton prompt, dándome el mensaje de: "yo amo JS". cuando eso lo debería mostrar Alert. Les agradecería mucho su ayuda, ya revise el código del enlace de la posible solución y lo compare pero no encuentro el error.
Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

5 respuestas

Hola Ruby yo lo hice de esta manera espero te ayude.
Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad
Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

Yo apenas estoy empezando en todo esto pero alcanzo a notar que en la variable que tienes de "resultado" en la funcion "suma" ya sumas el primerNumero y el segunNumero y en el alerta que usas los vuelves a sumar entonces eso quizas genere tu error.( recien note que usas una comilla normal ' ' debes cambiarla por este tipo de comilla (comilla invertida) cuando quieres insertar una variable dentro de un mensaje ) aca en el foro no muestra esa comilla pero mira el alert de mi ejercicio es esa misma

Fijate bien en el nombre de las funciones, la que tienes relacionada con el boton prompt es "alerta", debes cambiarla por "Mostraralerta"

Excelente... mil gracias por la ayuda!!

Lo intentaré de nuevo porque no me ha corrido, solo veo la pantalla con los botones.

¡Hola! Claro, con gusto reviso tu código. El error es una pequeña confusión entre los nombres de las funciones que llamas en tu HTML y cómo las has definido en tu archivo JavaScript.

El problema principal es que el botón con el texto "Prompt" está llamando a la función alerta(), que es la que contiene el mensaje "Yo amo JS". Además, el código que pide el nombre de la ciudad se está ejecutando apenas carga la página en lugar de esperar a que se presione un botón.


El Problema Detallado

  1. Llamada incorrecta en el botón "Prompt": En tu archivo index.html, el botón "Prompt" tiene el atributo onclick="alerta()".

    <button onclick="alerta();" class="button">Prompt</button>
    

    Si miras tu archivo app.js, la función alerta() es la que efectivamente muestra el mensaje "Yo amo JS". Por eso ves ese mensaje al presionar ese botón.

    function alerta () {
      alert('Yo amo JS')
    }
    
  2. Función inexistente en el botón "Alert": El botón "Alert" intenta llamar a una función llamada mostrarAlerta().

    <button onclick="mostrarAlerta();" class="button">Alert</button>
    

    Sin embargo, esta función no existe en tu archivo app.js, por lo que ese botón no hace nada.

  3. Código que se ejecuta solo: El código que pide el nombre de una ciudad de Brasil no está dentro de una función.

    let ciudadDeBrasil = prompt("Indique el nombre de una ciudad de Brasil");
    alert(`Estuve en ${ciudad} y me acorde de ti`) // <-- ¡Ojo! También hay un error aquí.
    

    Al no estar en una función, el navegador lo ejecuta tan pronto como lee el archivo app.js, es decir, al cargar la página.


La Solución

Para solucionarlo, necesitamos ordenar las funciones en app.js y asegurarnos de que el HTML llame a las correctas.

Paso 1: Arregla tu archivo app.js

Debemos crear una función para el código del prompt y renombrar la función alerta para que coincida con lo que el botón "Alert" espera.

// Cambia el contenido de la etiqueta h1
let titulo = document.querySelector('h1');
titulo.innerHTML = 'Hora del Desafío';

// Función para el botón "Console"
function mostrarMensaje() {
    console.log('El botón fue clicado');
}

// Función para el botón "Alert"
// RENOMBRAMOS la función 'alerta' a 'mostrarAlerta'
function mostrarAlerta() {
    alert('Yo amo JS');
}

// Función para el botón "Prompt"
// CREAMOS una función para el código que pide la ciudad
function preguntarCiudad() {
    let ciudadDeBrasil = prompt("Indique el nombre de una ciudad de Brasil");
    // CORREGIMOS el nombre de la variable en la alerta
    alert(`Estuve en ${ciudadDeBrasil} y me acordé de ti`);
}

// Función para el botón "Suma"
function sumaDosNumeros() {
    let primerNumero = parseInt(prompt('Escoge un número'));
    let segundoNumero = parseInt(prompt('Escoge otro número'));
    let resultado = primerNumero + segundoNumero;
    alert(`${primerNumero} + ${segundoNumero} = ${resultado}`);
}

Paso 2: Arregla tu archivo index.html

Ahora, solo necesitas cambiar el onclick del botón "Prompt" para que llame a la nueva función que creamos.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <header>
        <h1></h1>
    </header>
    <main class="container">
        <button onclick="mostrarMensaje();" class="button">Console</button>
        <button onclick="mostrarAlerta();" class="button">Alert</button>
        <button onclick="preguntarCiudad();" class="button">Prompt</button>
        <button onclick="sumaDosNumeros();" class="button">Suma</button>
    </main>

    <script src="app.js"></script>
</body>
</html>

Resumen del Arreglo

En resumen, los cambios que hicimos fueron:

  • Encapsular el código que pide la ciudad dentro de una nueva función llamada preguntarCiudad().
  • Renombrar la función alerta() a mostrarAlerta() para que el botón "Alert" funcione.
  • Actualizar el onclick del botón "Prompt" en el HTML para que llame a la función correcta (preguntarCiudad()).

LLego tarde pero espero te sirva, exito en tu aprendizaje!