Javascript – #2.15. Objetos del navegador (BOM). Window III. Cuadros de diálogo

En las lecciones anteriores ya vimos una introducción al objeto de navegador window, sus propiedades y algunos de los métodos más importantes.

En esta lección vamos a ver los cuadros de diálogo, que son tres métodos más del objeto window que utilizaremos muchísimo para interactuar con el usuario. Son tres:

  • alert: muestra un mensaje a un usuario, pero no recoge ningún valor.
  • prompt: muestra un mensaje a un usuario y, además, permite que el usuario introduzca un valor en su interior. Este valor quedará recogido en la variable a la que asignemos el prompt.
  • confirm: muestra un mensaje al usuario y dos botones. Si el usuario pulsa “Aceptar”, devuelve true y si pulsa “Cancelar” o cierra la ventana, devuelve false. Tanto true como false se almacenarán en la variable a la que asignemos el confirm.
Edu Recuerda

¡Recuerda! Para poder saber lo que ha elegido un usuario en un prompt o en un confirm es necesario que tanto uno como otro los asignemos a una variable.

¡Veamos esos tres cuadros de diálogo con detenimiento!

¡Consulta en la pestaña Materiales el código fuente trabajado en la lección!

¿No te ha quedado claro? ¿Quieres aportar tu punto de vista? ¡Deja tu comentario!

¡Ups! ¡Este contenido está restringido a codelovers! Inicia sesión o, si aún no eres miembro de Didacticode, regístrate!

8 comentarios
Contraer comentarios
Roberto Díaz Añares 07/12/2020 a las 12:17

Hola, lo primero decirte que me gustan mucho tus videos, ya que explicas muy bien los conceptos, gracias.
Lo segundo es una duda. Cuando introduces algo mediante el metodo prompt en una variable , la almacena como una cadena cierto?, yo tengo que hacer una aplicación que me solicite introducir un numero del 1 al 10 para ejecutar una serie de operaciones con él. Al principio no hacia nada al ser string pero he utilizado el comando parseInt para convertirlo a entero. No se si habría otro método para hacerlo ya que solo puede utilizar números la aplicación. Espero tu respuesta y muchas gracias de antemano.

didacticode (Administrador) 08/12/2020 a las 01:03

¡Hola, Roberto!
Efectivamente, es tal y como me lo has explicado. Los cuadros de diálogo, los inputs, etc. siempre reciben cadenas porque no saben exáctamente qué tipo de datos van a capturar (en Javascript no definimos los tipos de datos como en otros lenguajes de programación).
Por tanto, una vez capturamos un dato, podemos parsearlo al tipo que necesitemos. En tu caso, a un entero con un parseInt.
Puedes hacerlo así: let numero = parseInt(prompt(“Introduce un número”));
Claro, piensa que puedes admitir cualquier número entero, así que podrían introducirte un 13 o un -7. Para evitarlo tendrías que hacer una validación en la que, en caso de que el usuario introdujera un número diferente del 1 al 10 te diera un error; o si introdujera una cadena (que parseInt devolvería NaN -not a number-).
¿Más opciones? Podrías utilizar en lugar de parseInt un Number(prompt(“Introduce un número”));
Y otra opción, si quieres garantizar que el usuario no mete otra cosa que no sean números del 1 al 10 es utilizar un input type=”number” con restricciones de rango del 1 al 10
¡Dale una vuelta y si tienes cualquier duda más ya sabes! ¡Un saludo!

Roberto Díaz Añares 08/12/2020 a las 16:20

muchisimas gracias, he probado con el segundo ejemplo y me funciona perfectamente como yo quiero. un saludo

didacticode (Administrador) 08/12/2020 a las 18:04

¡Me alegro, Roberto! ¡Un saludo!

Que maravilla de respuestas le dieron al compañero Roberto.
Se ve mimo y vocación en lo que haces/n.
Mil gracias por ayudarnos a tantos.

didacticode (Administrador) 23/01/2021 a las 23:36

¡Espero que quedara clara!
Sí, “hago”: en principio soy yo sola (y mis “ayudantes imaginarios” Ada y Edu, jejeje).
¡Mil gracias por tu comentario, Borja!

Muchas gracias por tus respuestas, Ada.
Yo tengo una sobre lo que nos explicas
Cuando introduces como Number(prompt(«Introduce un número»));
Al no declarar una variable ¿Cómo puedes acceder a ese dato?

didacticode (Administrador) 02/03/2021 a las 00:58

¡Hola, Merche! No sé por qué no te había respondido a este mensaje.
Verás, no sé exactamente dónde te refieres a que haga esa instrucción, pero como bien dices, no tiene sentido porque no podrías acceder al dato. El prompt deberías siempre asignarlo a una variable para poder tratarlo más adelante. ¿Ha quedado claro?

Deja un comentario