7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Code
  2. Regular Expressions

Hoja de referencia de Regex en JavaScript

Scroll to top
Read Time: 7 mins

Spanish (Español) translation by Charles (you can also view the original English article)

Para trabajar exitosamente con expresiones regulares es necesario saber qué es lo que hace cada carácter especial, bandera y método. Esta es una hoja de trucos de expresiones regulares que puedes consultar cuando intentes recordar cómo funciona un método, un carácter especial o una bandera.

Definición de una expresión regular en JavaScript

Hay dos formas de definir una expresión regular en JavaScript.

  • var rgx = /^(\d+)/ Puedes utilizar un literal de expresión regular y encerrar el patrón entre barras. Esto se evalúa en el tiempo de compilación y proporciona un mejor rendimiento si la expresión regular es constante.
  • var rgx = new RegExp('^(\d+)')  La función del constructor es útil cuando la expresión regular puede cambiar programáticamente. Estas se compilan durante el tiempo de ejecución.

Coincidencia de un conjunto específico de caracteres

Las siguientes secuencias pueden utilizarse para hacer coincidir un conjunto específico de caracteres.

  • \w   Coincide con todos los caracteres de las palabras. Los caracteres de las palabras son alfanuméricos (a-z, caracteres A-Z y guión bajo).
  • \W  Coincide con los caracteres que no son palabras. Todo excepto los caracteres alfanuméricos y el guión bajo.
  • \d  Coincide con los caracteres de los dígitos. Cualquier dígito del 0 al 9.
  • \D  Coincide con los caracteres no numéricos. Todo excepto del 0 al 9.
  • \s  Coincide con los caracteres de los espacios en blanco. Esto incluye espacios, tabulaciones y saltos de línea.
  • \S   Coincide con todos los demás caracteres excepto los espacios en blanco.
  • .  Coincide con cualquier carácter excepto los saltos de línea.
  • [A-Z]  Coincide con los caracteres de un rango. Por ejemplo, [A-E] coincidirá con A, B, C, D y E.
  • [ABC] Coincide con un carácter del conjunto dado. Por ejemplo, [AMT] sólo coincidirá con A, M y T.
  • [^ABC]  Coincide con todos los caracteres no presentes en el conjunto dado. Por ejemplo,[^A-E] coincidirá con todos los demás caracteres excepto A, B, C, D y E.

Especificación del número de caracteres que deben coincidir

Todas las expresiones anteriores coinciden con un solo carácter a la vez. Puedes añadir cuantificadores para especificar cuántos caracteres deben incluirse en la coincidencia a la vez.

  • +  Coincide con una o más apariciones del token precedente. Por ejemplo, \w+ devolverá ABD12D como una única coincidencia en lugar de seis coincidencias diferentes.
  • *  Coincide con cero o más apariciones del token precedente. Por ejemplo, b\w* coincide con las partes en negrita de b, bat, bajhdsfbfjhbe. Básicamente, coincide con cero o más caracteres de palabras después de 'b'.
  • {m, n}  Coincide con al menos m y como máximo n ocurrencias del token anterior. {m,} coincidirá con al menos m ocurrencias, y no hay límite superior a la coincidencia. {k} coincidirá exactamente con k ocurrencias del token anterior.
  • ?  Coincide con cero o una ocurrencia del carácter precedente. Por ejemplo, esto puede ser útil cuando se buscan dos variaciones de la ortografía de la misma obra. Por ejemplo, /behaviou?r/ coincidirá con behavior y behaviour.
  • |  Coincide con la expresión antes o después del carácter de la tubería. Por ejemplo, /se(a|e)/ coincide con ver y mar.

Expresiones regulares relacionadas con el paréntesis

  • (ABC)  Esto agrupará varios tokens y recordará la subcadena coincidente con ellos para su uso posterior. Esto se llama grupo de captura.
  • (?:ABC)  Esto también agrupará múltiples fichas pero no recordará la coincidencia. Se trata de un grupo no capturador.
  • \d+(?=ABC)  Coincidirá con la(s) ficha(s) que precede(n) a la parte (?=ABC) sólo si va seguida de ABC. La parte ABC no se incluirá en la coincidencia. La parte \d es sólo un ejemplo. Puede ser cualquier otra cadena de expresión regular.
  • \d+(?!ABC)  Coincidirá con la(s) ficha(s) que precede(n) a la parte (?!ABC) sólo si no va seguida de ABC. La parte ABC no se incluirá en la coincidencia. La parte \d es sólo un ejemplo. Puede ser cualquier otra cadena de expresión regular.

Otros caracteres de expresiones regulares

También hay otros caracteres de expresiones regulares que no se han tratado en las secciones anteriores:

  • ^  Busca la expresión regular al principio de la cadena o al principio de una línea si la bandera multilínea está activada.
  • $  Busca la expresión regular al final de la cadena o al final de una línea si la bandera multilínea está activada.
  • \b Coincide con el token anterior sólo si hay un límite de palabra.
  • \B - Coincide con el token anterior sólo si no hay límite de palabra.

Uso de indicadores con expresiones regulares

Los indicadores pueden utilizarse para controlar cómo debe interpretarse una expresión regular. Puedes utilizar los indicadores solas o juntas en el orden que desee. Estos son los cinco indicadores que están disponibles en JavaScript.

  • g  Busca en la cadena todas las coincidencias de la expresión dada en lugar de devolver sólo la primera.
  • i Hacer que la búsqueda no distinga entre mayúsculas y minúsculas para que palabras como Apple, aPPLe y apple puedan coincidir todas a la vez.
  • m Este indicador hará que los tokens ^ y $ busquen una coincidencia al principio o al final de cada línea en lugar de toda la cadena.
  • u  Este indicador te permitirá utilizar escapes de puntos de código Unicode en su expresión regular.
  • y  Esto le hará saber a JavaScript que sólo busque una coincidencia en la posición actual de la cadena de destino.

Puedes especificar indicadores para una expresión regular en JavaScript añadiéndolas al final de un literal de expresión regular o pasándolas al constructor de RegExp. Por ejemplo, /cat/i coincide con todas las apariciones de cat independientemente de las mayúsculas y minúsculas, y RegExp("cat", 'i') hace lo mismo.

Métodos útiles de expresiones regulares en JavaScript

Las expresiones regulares que se crean utilizando los indicadores y las secuencias de caracteres que hemos discutido hasta ahora están destinadas a ser utilizadas con diferentes métodos para buscar, reemplazar o dividir una cadena. Estos son algunos métodos relacionados con las expresiones regulares.

  • test() - Comprueba si la cadena principal contiene una subcadena que coincide con el patrón especificado por la expresión regular dada. Devuelve true en caso de coincidencia exitosa y false en caso contrario.

En el ejemplo anterior, la expresión regular debe buscar la palabra manzanas sólo al final de la cadena. Por eso obtuvimos false en el primer caso.

  • search()  Comprueba si la cadena principal contiene una subcadena que coincida con el patrón especificado por la expresión regular dada. Devuelve el índice de la coincidencia en éxito y -1 en caso contrario.

En este caso, la primera expresión regular devolvió -1 porque no había una coincidencia exacta entre mayúsculas y minúsculas.

  • match()  Busca si la cadena principal contiene una subcadena que coincida con el patrón especificado por la expresión regular dada. Si la bandera g está activada, las coincidencias múltiples se devolverán como una matriz.
  • exec()  Busca si la cadena principal contiene una subcadena que coincida con el patrón especificado por la expresión regular dada. La matriz devuelta contendrá información sobre la coincidencia y los grupos de captura.
  • replace()  Busca una subcadena que coincida con el patrón dado y la sustituye por la cadena de sustitución proporcionada.
  • split()  Este método te permitirá dividir la cadena principal en subcadenas basándose en el separador especificado como expresión regular.

Conclusión

En los tutoriales anteriores, he hablado de los fundamentos de las expresiones regulares, así como algunas expresiones más complicadas que a veces pueden resultar útiles . Estos dos tutoriales explicaron cómo funcionan los diferentes caracteres o secuencias de caracteres en las expresiones regulares.

Si las expresiones regulares siguen confundiéndote, mi consejo sería que sigas practicando y que veas cómo otras personas elaboran expresiones regulares para hacer un patrón determinado.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.