Herramientas para desarrolladores : Cursos, manuales y guías de referencia : Cursos : JavaScript avanzado :
Expresiones regulares
- Introducción
- Creación de una expresión regular
- Creación de los patrones
- Aplicación a la validación de campos de formularios
1. Introducción
Las Expresiones Regulares son patrones que permiten buscar coincidencias con combinaciones de caracteres dentro de cadenas de texto. Estos patrones pueden utilizarse con los metodos exec y text del objeto RegExp, y con los metodos match, replace, search y split del objeto String.
Las expresiones regulares están disponibles a partir de la versión 1.2 de JavaScript (Netscape Navigator 4.x y Microsoft Internet Explorer 4.x).
2. Creación de una expresión regular
Par crear una expresión regular, puede utilizarse uno de los siguientes métodos:
exp_reg = /ab+c/
exp_reg = new RegExp("ab+c")
La primera opción compila la expresion regular cuando se evalúa el script, por lo que es mejor cuando la expresión regular es una constante y no va a variar a lo largo de la ejecución del programa. La segunda opción compila la expresión regular en tiempo de ejecución.
3. Creación de los patrones
Una expresión regular es una combinación de carácteres normales con
carácteres espciales. Por ejemplo, la expresión regular /ejemplo/
encontrará la subcadena "ejemplo" dentro de la cadena "Esto es un
ejemplo."
Con la utilización de carácteres especiales se consigue encontrar coincidencias con los
retornos de carro, los tabuladores, el inicio o el final de las palabras, las repeticiones
de caracteres...
La siguiente tabla muestra una lista de los carácteres especiales más importantes, así
como su significado y un ejemplo de aplicacion:
| Caracter | Significado | Ejemplo |
| \ | Indica que el siguiente caracter normal debe ser considerado como especial. También se utiliza como caracter de escape para los caracteres especiales. | /\n/ encuentra un salto de líena. Si se desea buscar el caracter '\', habrá que utilizar /\\/ |
| ^ | Se utiliza para encontrar el comienzo de una línea. | /a/ encuentra una 'a' en cualquier lugar, pero /^a/ haya una coincidencia con el caracter 'a' si se encuentra al comienzo de una línea. |
| $ | Se utiliza para encontrar el final de una línea. | |
| * | Encuentra coincidencia del caracter que le precede cuando aparece 0 o más veces en la cadena. | /hola*/ encuentra coincidencias en las cadena "hol", "hola" y "holaaaa". |
| + | Igual que el '*', pero cuando el caracter aparece 1 o más veces. | |
| ? | Igual que el '*', pero cuando el caracter aparece 0 o 1 vez. | |
| . | Se utiliza para encontrar cualquier caracter que no sea un caracter de nueva línea. | /.sa/ encontrará coincidencias en las cadenas "casa", "cosa" y "cesa", pero no en "asa". |
| (x) | Encuentra coincidencias con 'x', y recuerda el patrón para su posterior utilización. | |
| x|y | Encuentra coincidencia si aparece el caracter 'x' o el caracter 'y'. | |
| {n} | Encuentra coincidencia si hay exactamente n apariciones del caracter que precede. | Por ejemplo, /a{3}/ encuentra coincidencia en "holaaa", pero no en "holaa". |
| {n,} | Encuentra coincidencia si hay al menos n apariciones del caracter que precede. | |
| {n,m} | Encuentra coincidencia si hay como mínimo n y com máximo m apariciones del caracter que precede. | |
| [xyz] | Representa un conjunto de caracteres individuales. | /[aeiou]/ encuentra coincidencias con cualquier vocal. Si se utiliza el caracter '-' se pueden definir rangos. Por ejemplo, /[0-3]/ encuentra coincidencias si aparecen en la cadena los caracteres '0', '1', '2' o '3'. |
| [^xyz] | Representa un conjunto de caracteres individuales complementario. Encunetra coincidencias con aquellos caracteres que NO aparezcan en el conjunto. Al igual que en el caso anterior, con el '-' se pueden definir rangos. | |
| [\b] | Encuentra coincidencia con el caracter de retroceso. | |
| \b | Encuentra coincidencias con los límites de las palabras. | Por ejemplo, /\bola/ encuentra la cadena "ola" en "Viene una ola", pero no en "Viene una cola". |
4. Aplicación a la validación de campos de formularios
Una de las aplicaciones más habituales de las expresiones regulares es la validación de campos de formularios. Para ello, se crea una función de validación que contiene una expresión regular por cada tipo de campo que se desea validar.
Por ejemplo, podemos crear una expresión regular para campos de teléfono, que compruebe que se han introducido sólo números, espacios o el caracter '-' en el campo correspondiente.
Para validar los campos se utiliza el método test de la expresión regular correspondiente. Este método compara la cadena que se le pasa como argumento con el patrón de la expresión regular.
El siguiente ejemplo valida campos de teléfono y direcciones de correo electrónico:
function ValidaCampos(formulario) {
//expresion regular para telefonos
//permite campos vacios y guiones
var er_tlfono = /(^[0-9\s\+\-])+$/
//expresion regular para emails
var er_email = /^(.+\@.+\..+)$/
//comprueba campo tlfono de formu
//usa el metodo test de expresion regular
if(!er_tlfono.test(formu.tlfono.value)) {
alert('Campo TELEFONO no válido.')
return false //no submit
}
//comprueba el campo email de formu
//usa metodo test de la expresion regular
if(!er_email.test(formu.email.value)) {
alert('Campo E-MAIL no válido.')
return false //no submit
}
return true //pasa al submit
}
La función de validación se invoca utilizando el evento onSubmit del formulario. Cuando la validación no da positivo, la función de validación devuelve false. Esto cancela el submit, de modo que el usuario pueda corregir la entrada incorrecta. En caso contrario, se devuelve true. El tag form quedaría así:
<form name="formu" action="enviar.cgi" onSubmit="return ValidaCampos(this)">
El gran inconveniente de este procedimiento es que sólo funciona a partir de las versiones 4.0 de los navegadores de Microsoft y Netscape.
