Comparación de Cadenas en JavaScript: Ejemplo Práctico
Comparación de Cadenas en JavaScript: Ejemplo Práctico
En JavaScript, comparar cadenas de texto es una tarea común. Veamos un ejemplo donde se valida si un nombre ingresado por el usuario coincide con una cadena específica ("Victoria").
Código HTML/JS:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Comparación de Cadenas</title> </head> <body> <h1>Introducir Nombre</h1> <form id="nameForm"> <label for="nombre">Nombre:</label> <input type="text" id="nombre" name="nombre" required> <button type="submit">Enviar</button> </form> <p id="mensaje"></p> <script> const form = document.getElementById('nameForm'); form.addEventListener('submit', function(event) { event.preventDefault(); // Evita recargar la página const nombre = document.getElementById('nombre').value; // Comparación estricta (===) if (nombre === "Victoria") { document.getElementById('mensaje').textContent = "¡Hola Victoria!"; } else { document.getElementById('mensaje').textContent = "Nombre no reconocido."; } }); </script> </body> </html>
¿Qué hace este código?
Captura el nombre ingresado por el usuario en un formulario.
Compara la cadena con
"Victoria"usando el operador===(comparación estricta).Muestra un mensaje personalizado si coincide, o un mensaje genérico si no.
Detalles clave:
✔ === vs ==:
===compara valor y tipo de dato (recomendado).==solo compara el valor (puede dar resultados inesperados).
✔ Case-sensitive:
"victoria"no es igual a"Victoria"(diferencia mayúsculas/minúsculas).
✔ Prevención de recarga:
event.preventDefault()evita que el formulario recargue la página.
¿Has usado comparaciones de cadenas en tus proyectos? ¡Comenta tu experiencia! 🚀
Comentarios
Publicar un comentario