Expresión regular de JavaScript

Muchos programadores están familiarizados con la noción de que la expresión regular es un concepto útil pero subestimado. Pero, no saben muy bien cómo usar expresiones regulares de manera eficiente. Las expresiones regulares se utilizan no solo en JavaScript sino en casi todos los demás lenguajes de programación. En este artículo, aprenderá sobre expresiones regulares paso a paso. Debería ser fácil para los programadores de cualquier nivel comprender los conceptos cubiertos en este artículo.

A Expresión regular es un objeto en el que se dan patrones que coincidan con la cadena deseada.

Sintaxis

La sintaxis para una expresión regular es muy simple y se puede escribir de la siguiente manera:

/Patrón/banderas

A patrón es una cadena en la que proporciona un patrón para que coincida con otra cadena.
Banderas son atributos opcionales que tienen propósitos variados. Por ejemplo, la bandera "G" significa "Global", entre muchos otros.

El alcance de las expresiones regulares es muy amplia. Le mostraremos los básicos que son más necesarios para programar a través de una explicación paso a paso y algunos ejemplos de la vida real.

Hay muchos métodos en los que es posible que necesite usar expresiones regulares, por ejemplo, en los métodos de búsqueda (), reemplazar (), match () y divididos de JavaScript. Comenzaremos con una búsqueda simple de cadenas sin usar la expresión regular, y más tarde, le mostraremos cómo realizar la misma búsqueda utilizando expresiones regulares.

Ejemplos

Primero supondremos la cadena:

Str = "Linuxhint es genial. Linuxhint está funcionando muy bien y realizando 100%."

Hemos repetido la misma palabra "excelente" y "Linuxhint"En la frase. El propósito de esta extraña cuerda se volverá obvio en un momento.

Está bien! Ahora, simplemente escribiremos el método de cadena de búsqueda de JavaScript para buscar el término "trabajo"

stri.búsqueda ("trabajo");

Como puede ver, muestra el índice desde donde comenzó el "trabajo" de subcadena dado. Ahora, seguiremos adelante e intentaremos hacer lo mismo con la sintaxis regex.

Paso 1: busque y reemplace una subcadena

Puede buscar una cadena coincidente utilizando una expresión regular simplemente colocando la subcadena entre las dos cortes en la expresión.

stri.búsqueda (/trabajo/);

Como puede ver, también nos ha dado la misma salida.

Está bien! Ahora, veremos qué podemos hacer con la expresión regular. Intentemos reemplazar la palabra "excelente"Con, diga,"impresionante"Usando el método reemplazar ().

stri.reemplazar ("genial", "impresionante");

Aquí, puedes ver el problema: la primera ocurrencia de "excelente"Ha sido reemplazado, pero el segundo no ha.

En el primer paso, simplemente aprendió a buscar una cadena utilizando una expresión regular. Ahora, avanzaremos hacia el siguiente paso y aprenderemos sobre el concepto de banderas.

Paso 2: banderas

En este paso, aprenderá más sobre el concepto y el propósito de las banderas en expresiones regulares. Usaremos el método de reemplazo de JavaScript para explicar esta idea.

Si desea reemplazar todas las ocurrencias de "excelente,"Puedes usar la expresión regular con el 'gramo'Flag, que es la abreviatura de Global.

stri.reemplazar (/genial/g, "impresionante");

Perfecto, todas las ocurrencias de "Great" ahora se cambian. Pero, puede enfrentar un problema si intenta cambiar todas las ocurrencias de "Linuxhint" para, digamos, "nuestro sitio web" utilizando la misma técnica.

Intentaremos hacer eso primero, luego veremos cómo podemos resolver este problema.

stri.reemplazar (/linuxhint/g, "nuestro sitio web");

Aunque hemos proporcionado a la bandera global la expresión regular, la primera ocurrencia no cambia. Esto se debe a la sensibilidad de los casos. Por lo tanto, también necesitaremos proporcionar la bandera de insensibilidad de casos 'i,' en este caso. Puedes hacer esto simplemente agregando el 'i'Bandera junto con el'gramo' bandera.

stri.reemplazar (/linuxhint/gi, "nuestro sitio web");

Excelente. Como puede ver, todos los ocurrencias del término "Linuxhint"Se han cambiado al término"nuestra página web,"Independientemente de la sensibilidad a los casos.

Del mismo modo, puede usar expresiones regulares en la función Split () de JavaScript.

stri.división (/linuxhint/gi);

Está bien! La función funcionó bien. El método Split () ha devuelto la matriz de sustros, en función del término "Linuxhint". Pero, si desea incluir a los separadores también en la matriz de la subconjoce, tendrá que jugar con los patrones.

Entonces, en este paso, hemos aprendido sobre las banderas y cómo nos ayudan. Hay más banderas disponibles. Por ejemplo, "M" es para la coincidencia multilínea, "S" es para Dot All, etc. Ahora, pasaremos al concepto de patrones y aprenderemos a usar estos elementos.

Paso 3: Patrones

En este paso, aprenderá cómo utilizar los patrones y las opciones relacionadas.
Para incluir los separadores en la matriz de la subcadena, simplemente agregue paréntesis alrededor del patrón, como se puede ver en la siguiente imagen:

stri.Split (/(Linuxhint)/GI);

Perfecto! Como puede ver, los separadores también se incluyen en la variedad de subcadenas.

Para dividir la base de dos separadores, puede dar múltiples subcadenas en una expresión regular utilizando o "|" operador.

stri.Split (/Linuxhint | Great/GI);

Está bien! El operador funcionó muy bien, ya que esperamos que se divida.

Bartosa

Ahora, dividir entre la base del espacio "" o el punto "."Es decir, agregar caracteres especiales en la expresión regular, agregue un" \ "de barra inalcanzada antes de cualquier personaje especial.

stri.división (/\ | \./soldado americano);

Bien, hasta ahora, todo bien. Por ejemplo, digamos, desea cambiar los puntos en comas en la siguiente expresión:

stri.reemplazar(/\./g, ",");

Funcionó!

Las versas de fondo también se usan para otro propósito. Para buscar cualquier palabra, dígito o espacio, puede usar \ w, \ d y \ s, respectivamente. Por ejemplo, para reemplazar espacios con guiones, se usa la siguiente expresión:

stri.reemplazar (/\ s/g, "-");

Impresionante! Realmente puedes ver el potencial en expresiones regulares, ahora.

Corchetes [ ]

Si desea reemplazar varios caracteres en una cadena, puede proporcionarlos todos en un solo soporte cuadrado, y serán reemplazados por la subcadena dada. Por ejemplo, si desea reemplazar tres letras en una cadena y no desea poner mucho o "|" Operadores En la expresión regular, puede usar sintaxis de soporte cuadrado, en el que puede dar varias letras, como esta:

stri.reemplazar (/[nia]/g, "u");

Incluso puedes dar una variedad de letras, como esta:

stri.reemplazar (/[g-l]/g, "u");

O, un rango de números:

stri.reemplazar (/[0-5]/g, "9");

Y, si desea excluir a los personajes proporcionados en los soportes cuadrados, puede usar el carácter de careto, así:

stri.reemplazar (/[^g-l]/g, "t");

Esto es útil al obtener datos de los usuarios y probar y validar esos datos, especialmente en el correo electrónico, el teléfono o la validación de la fecha.

Conclusión

Este artículo acaba de rascar la superficie de la expresión regular de JavaScript. Cubre los conceptos solo desde el principiante hasta el nivel intermedio. Hay mucho más que aprender sobre la expresión regular, y puedes usar esta expresión para hacer muchas cosas en las que ni siquiera has pensado. Para seguir aprendiendo, trabajando y obteniendo más experiencia en JavaScript, consulte más artículos sobre este tema en Linuxhint.comunicarse.