Expresiones Regulares

Crear una expresin regular

Construyes una expresin regular en una de estas dos formas:

• Usando una expresin regular literal, que consiste en un patrn encerrado entre barras, como sigue:

  js

  let re = /ab+c/;
  

  Las expresiones regulares literales proporcionan la compilacin de la expresin regular cuando se carga el script. Si la expresin regular permanece constante, su uso puede mejorar el rendimiento.

• O llamando a la funcin constructora del objeto RegExp, de la siguiente manera:

  js

  let re = new RegExp("ab+c");
  

  El uso de la funcin constructora proporciona una compilacin en tiempo de ejecucin de la expresin regular. Usa la funcin constructora cuando sepas que el patrn de la expresin regular cambiar, o no conoces el patrn y lo obtienes de otra fuente, como la entrada del usuario.

Escribir un patrn de expresin regular

Un patrn de expresin regular se compone de caracteres simples, como /abc/, o una combinacin de caracteres simples y especiales, como /ab*c/ o /Captulo (\d)\.\d*/. El ltimo ejemplo incluye parntesis, que se utilizan como dispositivos de memoria. La coincidencia realizada con esta parte del patrn se recuerda para su uso posterior, como se describe en Uso de grupos.

Usar patrones simples

Los patrones simples se construyen con caracteres para los que deseas encontrar una coincidencia directa. Por ejemplo, el patrn /abc/ coincide con combinaciones de caracteres en cadenas solo cuando ocurre la secuencia exacta "abc" (todos los caracteres juntos y en ese orden). Tal coincidencia tendra xito en las cadenas "Hola, conoces tu abc?" y "Los ltimos diseos de aviones evolucionaron a partir de slabcraft". En ambos casos, la coincidencia es con la subcadena "abc". No hay ninguna coincidencia en la cadena "Grab crab" porque aunque contiene la subcadena "ab c", no contiene la subcadena "abc" exacta.

Usar caracteres especiales

Cuando la bsqueda de una coincidencia requiere algo ms que una coincidencia exacta, como por ejemplo buscar una o ms 'b', o encontrar espacios en blanco, puedes incluir caracteres especiales en el patrn. Por ejemplo, para hacer coincidir una sola "a" seguida de cero o ms "b"s seguidas de "c", usaras el patrn /ab*c/: el * despus de "b" significa "0 o ms apariciones del elemento anterior". En la cadena "cbbabbbbcdebc", este patrn coincidir con la subcadena "abbbbc".

Las siguientes pginas proporcionan listas de los diferentes caracteres especiales que encajan en cada categora, junto con descripciones y ejemplos.

Aserciones

Las aserciones incluyen lmites, que indican el comienzo y el final de lneas y palabras, y otros patrones que indican de alguna manera que el reconocimiento es posible (incluidas las expresiones anticipadas, inversas y condicionales).

Clases de caracteres

Distingue diferentes tipos de caracteres. Por ejemplo, distinguir entre letras y dgitos.

Grupos y rangos

Indica grupos y rangos de caracteres de expresin.

Cuantificadores

Indica el nmero de caracteres o expresiones que deben coincidir.

Escapes de propiedades Unicode

Distinguir segn las propiedades de los caracteres Unicode, por ejemplo, letras maysculas y minsculas, smbolos matemticos y de puntuacin.

Si deseas ver todos los caracteres especiales que se pueden usar en expresiones regulares en una sola tabla, consulta lo siguiente:

Escapando

Si necesitas usar literalmente cualquiera de los caracteres especiales (en realidad buscando un "*", por ejemplo), lo debes escapar colocando una barra invertida delante de l. Por ejemplo, para buscar "a" seguido de "*" seguido de "b", usaras /a\*b/ la barra invertida "escapa" de "*", volvindola literal en lugar de especial.

De manera similar, si ests escribiendo un literal de expresin regular y necesitas buscar una barra inclinada ("/"), la debes escapar (de lo contrario, esta termina el patrn). Por ejemplo, para buscar la cadena "/ejemplo/" seguida de uno o ms caracteres alfabticos, usaras /\/ejemplo\/[a-z]+/i: las barras invertidas antes de cada barra, las hace literales.

Para hacer coincidir una barra invertida literal, debes escapar de la barra invertida. Por ejemplo, para encontrar la cadena "C:\" donde "C" puede ser cualquier letra, usaras /[A-Z]:\\/ la primera barra invertida escapa a la que sigue, por lo que la expresin busca una sola barra invertida literal.

Si usas el constructor RegExp con un literal de cadena, recuerda que la barra invertida es un escape en los literales de cadena, por lo que para usarlo en la expresin regular, debes escapar en el nivel del literal de cadena. /a\*b/ y new RegExp("a\\*b") crean la misma expresin, que busca "a" seguida de un "*" literal seguido de "b".

Si las cadenas de escape an no forman parte de tu patrn, puedes agregarlas usando String.replace:

function escapeRegExp(string) {
  return string.replace(/[.*+\-?^${}()|[\]\\]/g, "\\$&"); // $& significa toda la cadena coincidente
}

La "g" despus de la expresin regular es una opcin o indicador que realiza una bsqueda global, buscando en toda la cadena y devolviendo todas las coincidencias. Se explica en detalle a continuacin en Bsqueda avanzada con indicadores.

Por qu no est integrada en JavaScript? Existe una propuesta para agregar esta funcin a RegExp, pero fue rechazada por TC39.

Usando parntesis

Los parntesis alrededor de cualquier parte del patrn de expresin regular hacen que se recuerde esa parte de la subcadena coincidente. Una vez reconocida, la subcadena se puede recuperar para otro uso. Consulta Grupos y rangos para obtener ms detalles.

Usar expresiones regulares en JavaScript

Las expresiones regulares se utilizan con los mtodos RegExp test() y exec() y con los mtodos de String, match(), replace(), search() y split(). Estos mtodos se explican en detalle en la referencia de JavaScript.

Cuando desees saber si un patrn se encuentra en una cadena, utiliza los mtodos test() o search(); para obtener ms informacin (pero una ejecucin ms lenta) utiliza los mtodos exec() o match(). Si usas exec() o match() y si la bsqueda tiene xito, estos mtodos devuelven un arreglo y actualizan las propiedades del objeto expresin regular asociado y tambin del objeto de expresin regular predefinido, el objeto RegExp. Si la bsqueda falla, el mtodo exec() devuelve null (que coacciona a false).

En el siguiente ejemplo, el script utiliza el mtodo exec() para encontrar una coincidencia en una cadena.

var myRe = /d(b+)d/g;
var myArray = myRe.exec("cdbbdbsbz");

Si no necesitas acceder a las propiedades de la expresin regular, una forma alternativa de crear myArray es con este script:

var myArray = /d(b+)d/g.exec("cdbbdbsbz");
// similar a "cdbbdbsbz" .match(/d(b+)d/g); sin embargo,
// "cdbbdbsbz" .match (/d(b+)d/g) genera Array ["dbbd"], mientras
// /d(b+)d/g.exec('cdbbdbsbz ') produce Array ['dbbd', 'bb', index: 1, input: 'cdbbdbsbz' ].

(Consulta diferentes comportamientos para obtener ms informacin sobre los diferentes comportamientos).

Si deseas construir la expresin regular a partir de una cadena, otra alternativa ms es este script:

var myRe = new RegExp("d(b+)d", "g");
var myArray = myRe.exec("cdbbdbsbz");

Con estos scripts, la bsqueda se realiza correctamente, devuelve el arreglo y actualiza las propiedades que se muestran en la siguiente tabla.

Como se muestra en la segunda forma de este ejemplo, puedes usar una expresin regular creada con un iniciador de objeto sin asignarla a una variable. Sin embargo, si lo hace, cada aparicin es una nueva expresin regular. Por este motivo, si utilizas esta forma sin asignarla a una variable, no podrs acceder posteriormente a las propiedades de esa expresin regular. Por ejemplo, supongamos que tienes este script:

var myRe = /d(b+)d/g;
var myArray = myRe.exec("cdbbdbsbz");
console.log("El valor de lastIndex es " + myRe.lastIndex);

// "El valor de lastIndex es 5"

Sin embargo, si tienes este script:

var myArray = /d(b+)d/g.exec("cdbbdbsbz");
console.log("El valor de lastIndex es " + /d(b+)d/g.lastIndex);

// "El valor de lastIndex es 0"

Las apariciones de /d(b+)d/g en las dos declaraciones son objetos de expresin regular diferentes y, por lo tanto, tienen valores diferentes para su propiedad lastIndex. Si necesitas acceder a las propiedades de una expresin regular creada con un iniciador de objeto, primero debes asignarla a una variable.

Bsqueda avanzada con banderas

Las expresiones regulares tienen seis indicadores opcionales que permiten funciones como la bsqueda global y que no distinga entre maysculas y minsculas. Estos indicadores se pueden usar por separado o juntos en cualquier orden y se incluyen como parte de la expresin regular.

Para incluir una bandera con la expresin regular, usa esta sintaxis:

var re = /patrn/banderas;

o

var re = new RegExp("patrn", "banderas");

Ten en cuenta que las banderas son parte integral de una expresin regular. No se pueden agregar ni eliminar ms tarde.

Por ejemplo, re = /\w+\s/g crea una expresin regular que busca uno o ms caracteres seguidos de un espacio y busca esta combinacin en toda la cadena.

var re = /\w+\s/g;
var str = "fee fi fo fum";
var myArray = str.match(re);
console.log(myArray);

// ["fee ", "fi ", "fo "]

Podras reemplazar la lnea:

var re = /\w+\s/g;

con:

var re = new RegExp("\\w+\\s", "g");

y obtener el mismo resultado.

El comportamiento asociado con el indicador g es diferente cuando se usa el mtodo .exec(). Los roles de "clase" y "argumento" se invierten: En el caso de .match(), la clase cadena (o tipo de datos) posee el mtodo y la expresin regular es solo un argumento, mientras que en el caso de .exec(), es la expresin regular la que posee el mtodo, siendo la cadena el argumento. Compara esto str.match(re) con re.exec(str). El indicador g se usa con el mtodo .exec() para obtener una progresin iterativa.

var xArray;
while ((xArray = re.exec(str))) {
  console.log(xArray);
}
// produce:
// ["fee ", index: 0, input: "fee fi fo fum"]
// ["fi ", index: 4, input: "fee fi fo fum"]
// ["fo ", index: 7, input: "fee fi fo fum"]

La bandera m se utiliza para especificar que una cadena de entrada de varias lneas se debe tratar como varias lneas. Si se usa el indicador m, ^ y $ coinciden al principio o al final de cualquier lnea dentro de la cadena de entrada en lugar del inicio o el final de toda la cadena.

Ejemplos

Usar caracteres especiales para verificar la entrada

En el siguiente ejemplo, se espera que el usuario ingrese un nmero de telfono. Cuando el usuario presiona el botn "Comprobar", el script verifica la validez del nmero. Si el nmero es vlido (encuentra la secuencia de caracteres especificada por la expresin regular), la secuencia de comandos muestra un mensaje agradeciendo al usuario y confirmando el nmero. Si el nmero no es vlido, el guin informa al usuario que el nmero de telfono no es vlido.

Entre parntesis que no capturan (?:, la expresin regular busca tres caracteres numricos \d{3} O | un parntesis izquierdo \( seguido de tres dgitos \d{3}, seguido de un parntesis cerrado \), (finaliza el parntesis no capturador )), seguido de un guin, una barra diagonal o un punto decimal y cuando lo encuentre, recuerde el carcter ([-\/\.]), seguido de tres dgitos \d{3}, seguido de la coincidencia recordada de un guin, una barra diagonal o un punto decimal \1, seguida de cuatro dgitos \d{4}.

El evento Change activado cuando el usuario presiona Enter establece el valor de RegExp.input.

HTML

<p>
  Ingresa tu nmero de telfono (con el cdigo de rea) y luego haz clic en
  "Comprobar".
  <br />
  El formato esperado es como ###-###-####.
</p>
<form action="#">
  <input id="phone" />
  <button >
    Comprobar
  </button>
</form>

JavaScript

var re = /(?:\d{3}|\(\d{3}\))([-\/\.])\d{3}\1\d{4}/;
function testInfo(phoneInput) {
  var OK = re.exec(phoneInput.value);
  if (!OK) {
    console.error(phoneInput.value + " isn't a phone number with area code!");
  } else {
    console.log("Gracias, tu nmero de telfono es " + OK[0]);
  }
}

Resultado

Herramientas

Probador de expresiones regulares

Un constructor/depurador de expresiones regulares en lnea

Visualizador de expresiones regulares

Un probador de expresiones regulares visual en lnea.

• Anterior
• Siguiente