Regex en JavaScript | Explicado con ejemplos

Regex en JavaScript | Explicado con ejemplos
Cuando un desarrollador pone sus ojos por primera vez en expresiones regulares o regex, parece galimatías. Sin embargo, pueden verse, las expresiones regulares son extremadamente útiles y lo convierten en un programador efectivo. El concepto Regex es un poco complicado, sin embargo, en esta publicación, lo guiaremos a través de simples pasos junto con ejemplos para ayudarlo a dominar a Regex en Javascript.

¿Qué es Regex en JavaScript??

La expresión regular o regular es simplemente una cadena que define un patrón y es muy útil para encontrar un patrón en una cadena o reemplazar una cadena con un patrón coincidente. En pocas palabras, suponga que desea validar una dirección de correo electrónico o número de teléfono con un patrón especificado, luego Regex es útil.

Sintaxis de Regex:

var myregex = /abc /;

Adjuntamos un patrón en la barra delantera "/" como se muestra arriba. También podemos usar el Regexp constructor para definir un patrón regex:

var myregex = new Regexp ('ABC');

Ahora que sabemos qué es Regex y cuál es su sintaxis, veamos ahora cómo especificar un patrón usando Regex en JavaScript.

Especificar el patrón usando regex

Para especificar patrones usando regex usamos metacharacteres que son caracteres que tienen un significado especial. Metacharacteres y lo que representan en Regex se da en la tabla a continuación:

Carácter meta Qué hace?
[] (Corchetes) Lo que sea que escribamos en los soportes cuadrados se combinará con una cadena dada. Por ejemplo [a B C] coincide con el A, B, y C caracteres con una cadena especificada. También podemos especificar un rango por ejemplo [A-F] es lo mismo que [a B C D e F] o [1-5] es lo mismo que [12345].
^ (Símbolo de caret) El símbolo de caret se usa para verificar si un texto o una cadena especificada comienza con un cierto carácter o no e.gramo. ^A Magos con ABC Sin embargo ^A no coincide con bac. El símbolo de caret dentro de los soportes cuadrados se utiliza para tomar el complemento de caracteres especificados. Por ejemplo [^ABC] Especifica que excepto A, B o C Cualquier personaje presente será emparejado.
$ (Símbolo de dólar) El ps Se usa el símbolo donde quiera verificar si una cadena termina con un cierto carácter o no. Por ejemplo, A $ significa que cualquier cadena con la que coincidan debería tener un al final, es decir amnesia será emparejado con A $ Sin embargo el corazón no.
* (Símbolo de estrella) El símbolo de la estrella coincide con 0 o más ocurrencias del patrón o carácter especificado presente que queda del símbolo de la estrella en una cadena. Por ejemplo, hombre significa que buscar my un personaje en una cadena. Por eso Minnesota tendrá 1 partido. Principal no tendrá ningún partido ya que a no es seguido por norte y ahí está i entre.
+ (más símbolo) El símbolo más es como un símbolo de estrella con la excepción de que coincide con 1 o más ocurrencias del patrón o carácter especificado. Por ejemplo, cuando Minnesota Se busca la cadena para la expresión Ma+N Sin embargo, no hay rival, cuando se busca la expresión para el hombre, hay una coincidencia.
(Aparatos ortopédicos) Tener una comprensión clara de los aparatos ortopédicos, primero veamos el siguiente código i-e 2,3 lo que significa que al menos 2 y como máximo 3 repeticiones son posibles del patrón que queda de él. Por ejemplo, la expresión A 2,3 Cuando se combina con la cadena "ABC DAT" Sin embargo, no tendrá coincidencia cuando la expresión coincida con el "ABC Daat" tendrá un partido i-e dAutomóvil club británicoT.
| (Modificación) La alteración o el símbolo de la barra vertical se usa para el operador ort. Por ejemplo, la expresión a | b indica que a o b debe estar presente en una cadena especificada. Por eso FGH no tiene partidos y a B C tiene 2 partidos que son abundante.
\ (Barra de retraso) El propósito de la barra insegura es escapar de los personajes y escapar de todos los metacharacteres. En palabras simples, si no está seguro de si un personaje contiene algún significado especial o no, entonces coloque una barra insegura ante el personaje. Por lo tanto, ese personaje no será tratado de ninguna manera especial, por ejemplo, \ $ A La expresión coincidirá con cualquier texto o cadena que tenga un ps seguido por a.

Ahora que sabemos cómo especificar patrones usando regex, ahora pase por algunos métodos regex para que coincidan con una regex con una cadena especificada.

Patrones de prueba para coincidir

Anteriormente, discutimos cómo podemos usar el constructor regexp para inicializar el objeto regexp con un patrón especificado. Este objeto regexp nos da muchos métodos incorporados y uno de ellos es el prueba() método. El prueba() El método es muy útil ya que verifica una cadena para un patrón especificado en la expresión regular. El prueba() El método devuelve un valor booleano, es decir, si el patrón especificado coincide con la cadena, entonces verdadero se devuelve, de lo contrario se devuelve el falso. Para comprender mejor el prueba() Método Veamos un ejemplo:

var myregex = /hello /;
salida var = myregex.Prueba ('Hola mundo!');
consola.log (salida); // verdadero

En el código anterior primero, definimos un patrón que es Hola y luego usó el método incorporado test () en el patrón especificado para verificar si la cadena Hola Mundo! Contiene hola o no. El resultado se da a continuación:

En lugar del valor booleano, la coincidencia de cadenas también se puede devolver con otro método incorporado que es el método coincidir (). El siguiente código está implementando el método Match ():

var myString = "Hola mundo!";
// patrón
var myregex = /hello /;
consola.Log (mystring.Match (myregex)); // Hola

Se devolverá una matriz que contendrá la cadena de entrada al método Match (), el índice en el que se encuentra la coincidencia, así como la coincidencia misma.

Si no se encuentra una coincidencia, entonces nulo Será devuelto:

var myString = "Hola mundo!";
// patrón
var myregex = /hi /;
consola.Log (mystring.Match (myregex)); // nulo

Banderas de patrones

Vimos que el objeto regexp acepta un patrón; Sin embargo, también debe tenerse en cuenta que el regexp también puede tomar un parámetro de bandera opcional. Las banderas son solo un poco de cobertura adicional que cambia el comportamiento de búsqueda.

La primera bandera que discutiremos es el ignorar la bandera denotado por yo. De forma predeterminada, la búsqueda de patrones en regex es sensible a la caja, por lo que para ignorar los casos, usamos el indicador de ignoración (i) al buscar un patrón. Por ejemplo:

var myregex = /hello /i;
consola.Log (Myregex.prueba ("Hola mundo!")); // verdadero

Aunque el patrón tiene Hola Y la cadena en el método de prueba tiene el primer capital de letra, sigue siendo una coincidencia porque utilizamos el indicador Ignore (i), por lo tanto, el resultado será cierto:

Para usar el indicador IGNORE con el objeto regexp, copie el siguiente código:

var myregex = new Regexp ('Hello', 'I');
consola.Log (Myregex.prueba ("Hola mundo!")); // verdadero

Del mismo modo, podemos usar el bandera global denotado por g cuya función es devolver todas las coincidencias en la cadena. Sin la bandera global, solo se devuelve el primer partido. El siguiente código utiliza el indicador global:

var myString = 'Hola mundo! y hola universo!';
var myregex = /hello /gi;
var coincides = [];
var coincida;
hacer
Match = myregex.ejecutora (myString);
if (match)
partidos.empuje (coincidora);

while (coincidente != nulo)
consola.registro (coincidencias);

Primero, inicializamos MyString que contiene la cadena que se utilizará para buscar un patrón, y después de eso, creamos un patrón de expresión regular que contiene la bandera global e ignora la bandera. La bandera global buscará todas las coincidencias, mientras que la bandera Ignore ignorará la sensibilidad de los casos. En el código anterior, se utiliza otro método integrado que es el ejecutivo () cuya función es devolver una matriz que contiene la coincidencia. Sin embargo, si no hubo coincidencia entre el patrón y la cadena, entonces se devolverá nulo. Cabe señalar que el método Exec () solo devuelve una sola coincidencia a la vez, por lo tanto, usamos el bucle do-while y empujamos todas las coincidencias a la matriz de coincidencias. Al final, consolamos registro de la matriz de coincidencias que contiene todos los partidos:

Conclusión

Regex es una cadena que define un patrón o encuentra un patrón en una cadena especificada. Usamos el objeto regexp o la barra hacia adelante / para definir regex. El RegExp también toma un parámetro opcional I-E Flag que cambia el comportamiento de búsqueda. Para especificar patrones usamos metacharacteres que son algunos caracteres específicos que tienen significados especiales. Para probar si coincide con una cadena o no, usamos métodos incorporados como Test (), Match () o Exec ().

En esta publicación, primero, definimos qué es Regex en JavaScript y qué es la sintaxis de Regex en JavaScript. Luego le mostramos cómo especificar patrones usando regex y patrones de prueba en JavaScript. Al final, discutimos las dos banderas que son globales e ignoramos las banderas.