30 fragmentos de código Regex útiles para desarrolladores web

Las expresiones regulares son una herramienta poderosa que debería estar en el cinturón de herramientas de cada desarrollador. Pueden coincidir con una serie de caracteres basados ​​en parámetros muy complejos, lo que puede ahorrarle mucho tiempo al crear sitios web dinámicos.

Los desarrolladores web se enfrentan a tareas diferentes a las de los desarrolladores de software, pero muchos de los fundamentos del mismo código permanecen. Expresiones regulares (o expresiones regulares) tienen un curva de aprendizaje inicial empinada, pero pueden ser tremendamente poderoso cuando se usa correctamente.

La parte más complicada es aprender la sintaxis y aprender a escribir su propio código de expresiones regulares desde cero. Para ahorrar tiempo, he organizado 30 fragmentos de código regex diferentes que puede incorporar en proyectos de desarrollo. Y como las expresiones regulares no se limitan a un solo idioma, puede aplicar estos fragmentos a cualquier cosa desde JavaScript a PHP o Pitón.

1. Fuerza de la contraseña

^ (? =. * [AZ]. * [AZ]) (? =. * [! @ # $ & *]) (? =. * [0-9]. * [0-9]) (? = . * [az]. * [az]. * [az]). 8 $

La comprobación de la fortaleza de una contraseña a menudo es subjetiva, por lo que no hay una respuesta correcta absoluta. Pero creo que este fragmento de expresión regular es un excelente punto de partida si no desea escribir su propio comprobador de seguridad de contraseñas desde cero. (Fuente)

2. Color hexadecimal

\ # ([a-fA-F] | [0-9]) 3, 6

El campo del desarrollo web es ubicuo con códigos de color hexadecimales. Este fragmento de expresión regular se puede utilizar para extraer coincidencias de código hexadecimal de cualquier cadena para cualquier propósito. (Fuente)

3. Validar la dirección de correo electrónico

/◆A-Z0-9._%+-◆+ +◆A-Z0-9-◆+ .+.[A-Z◆2,4/igm

Una de las tareas más comunes para un desarrollador es verificar si una cadena tiene el formato de una dirección de correo electrónico. Hay muchas variantes diferentes para realizar esta tarea, por lo que este enlace de SitePoint ofrece dos fragmentos de código distintos para verificar la sintaxis del correo electrónico contra una cadena. (Fuente)

4. Dirección IPv4

/\b(?:(?:25 [...] [...] [...] [...] [...] [...] [...] () () () () () () () ()) () () ()) () () (?: 25 [0-5] | 2 [0-4] [0-9] | [01]? [0-9] [0-9]?) \ B /

Similar a una dirección de correo electrónico es la dirección IP típica utilizada para identificar una computadora específica que accede a Internet. Esta expresión regular verificará una cadena para ver si sigue la sintaxis de la dirección IPv4. (Fuente)

5. Dirección IPv6

(([0-9a-fA-F] 1,4:) 7,7 [0-9a-fA-F] 1,4 | ([0-9a-fA-F] 1 , 4:) 1,7: | ([0-9a-fA-F] 1,4:) 1,6: [0-9a-fA-F] 1,4 | ([0-9a-fA-F] 1,4:) 1,5 (: [0-9a-fA-F] 1,4) 1,2 | ([0-9a -fA-F] 1,4:) 1,4 (: [0-9a-fA-F] 1,4) 1,3 | ([0-9a-fA-F] 1,4:) 1,3 (: [0-9a-fA-F] 1,4) 1,4 | ([0-9a-fA-F] 1,4 :) 1,2 (: [0-9a-fA-F] 1,4) 1,5 | [0-9a-fA-F] 1,4: ((: [0 -9a-fA-F] 1,4) 1,6) |: ((: [0-9a-fA-F] 1,4) 1,7 |:) | fe80: (: [0-9a-fA-F] 0,4) 0,4% [0-9a-zA-Z] 1, |: :( ffff (: 0 1,4) 0,1:) 0,1 ((25 [0-5] | (2 [0-4] | 1 0,1 [0-9]) 0,1 [0-9 ]) \.) 3,3 (25 [0-5] | (2 [0-4] | 1 0,1 [0-9]) 0,1 [0-9]) | ([0-9a-fA-F] 1,4:) 1,4: ((25 [0-5] | (2 [0-4] | 1 0,1 [0-9 ]) 0,1 [0-9]) \.) 3,3 (25 [0-5] | (2 [0-4] | 1 0,1 [0-9])  0,1 [0-9]))

Alternativamente, es posible que desee verificar una dirección para la nueva sintaxis de IPv6 con este fragmento de expresión regular más avanzado. La diferencia es menor aunque vital durante el desarrollo. (Fuente)

6. Separador de miles

/ \ d 1,3 (? = (\ d 3) + (?! \ d)) / g

Los sistemas de numeración tradicionales requieren una coma, punto o alguna otra marca cada tercer dígito en un número mayor. Este código de expresión regular opera en cualquier número y aplicará cualquier marca que elija a cada tercer dígito que se separa en miles, millones, etc. (Fuente)

7. Prepende HTTP al hipervínculo

if (! s.match (/ ^ [a-zA-Z] +: \ / \ //)) s = 'http: //' + s; 

Ya sea que esté trabajando con JavaScript, Ruby o PHP, esta expresión regular puede resultar muy útil. Verificará cualquier cadena de URL para ver si tiene un prefijo HTTP / HTTPS, y si no es así, prepárelo en consecuencia. (Fuente)

8. Extraer el dominio de la URL

/https?:\/\/(?:[-\w◆+\.)?([-\w◆+)\.\w+(?:\.\w+)?\/?.*/i

Cada dominio del sitio web contiene el protocolo inicial (HTTP o HTTPS) y muchas veces un subdominio más la ruta de la página adicional. Puedes usar este fragmento para cortar todo eso y devolver solo el nombre de dominio sin extras adicionales. (SourceL

9. Ordenar palabras clave por número de palabras

^ [^ \ s] * $ coincide exactamente con la palabra clave de 1 palabra ^ [^ \ s] * \ s [^ \ s] * $ coincide exactamente con la palabra clave de 2 palabras ^ [^ \ s] * \ s [^ \ s] * coincide con las palabras clave de al menos 2 palabras (2 y más) ^ ([^ \ s] * \ s) 2 [^ \ s] * $ coincide exactamente con la palabra clave de 3 palabras ^ ([^ \ s] * \ s ) 4 [^ \ s] * $ coincide con palabras clave de 5 palabras y más (longtail)

Los usuarios de Google Analytics y las Herramientas para webmasters realmente disfrutarán de esta expresión regular. Puede ordenar y organizar palabras clave según el número de palabras utilizadas en una búsqueda.

Esto puede ser numéricamente específico (es decir, solo 5 palabras) o puede coincidir con un rango de palabras (es decir, 2 o más palabras). Cuando se usa para ordenar datos analíticos, esta es una expresión poderosa. (Fuente)

10. Encuentra una cadena Base64 válida en PHP

\? php [\ t] eval \ (base64_decode \ (\ '(([A-Za-z0-9 + /] 4) * ([A-Za-z0-9 + /] 3 = | [A-Za-z0-9 + /] 2 ==)?) 1 \ '\) \) \;

Si eres un desarrollador de PHP, en algún momento es posible que necesites analizar código buscando objetos binarios codificados en Base64. Este fragmento de código se puede aplicar a todo el código PHP y buscará cualquier cadena Base64 existente. (Fuente)

11. Número de teléfono válido

^ \ +? \ d 1,3? [-.]? \ (? (?: \ d 2,3) \)? [-.]? \ d \ d \ d [-.]? \ d \ d \ d \ d $

Corto, dulce y al punto. Este código de expresiones regulares validará cualquier sintaxis de números de teléfono tradicional basada principalmente en el estilo americano de números de teléfono.

Dado que esto puede convertirse en un tema bastante complicado, recomiendo hojear este hilo de Pila para obtener respuestas más detalladas. (Fuente)

12. Espacio en blanco al principio y al final

^ [\ s] + | [\ s] + $

Utilice este fragmento de código para extraer espacios en blanco iniciales / finales de una cadena. Esto puede no ser un gran problema, pero a veces puede afectar la salida cuando se extrae de una base de datos o se aplica a otra codificación de documento. (Fuente)

13. Tire de la fuente de la imagen)

\< *[img][^\>] * [fuente] * = * [\ "\ '] 0,1 ([^ \" \' \>] *)

Si, por alguna razón, necesita extraer la fuente de una imagen directamente desde HTML, este fragmento de código es la solución perfecta. Aunque se puede ejecutar sin problemas en el backend, los desarrolladores de JS de frontend deberían confiar en el método .attr () de jQuery's para el frontend. (Fuente)

14. Valide la fecha en formato DD / MM / YYYY

^ (? :( ?: 31 (\ / | - | \.) (?: 0? [13578] | 1 [02])) \ 1 | (? :( ?: 29 | 30) (\ / | - | \.) (?: 0? [1,3-9] | 1 [0-2]) \ 2)) (? :( ?: 1 [6-9] | [2-9] \ d)? \ d 2) $ | ^ (?: 29 (\ / | - | \.) 0? 2 \ 3 (? :(? :( ?: 1 [6-9] | [2-9] \ d )? (?: 0 [48] | [2468] [048] | [13579] [26]) | (? :( ?: 16 | [2468] [048] | [3579] [26]) 00)) )) $ | ^ (?: 0? [1-9] | 1 \ d | 2 [0-8]) (\ / | - | \.) (? :( ?: 0? [1-9]) | (?: 1 [0-2])) \ 4 (? :(?: 1 [6-9] | [2-9] \ d)? \ D 2) $

Las fechas son complicadas porque pueden aparecer como texto + números, o simplemente como números con diferentes formatos. PHP tiene una función de fecha fantástica, pero esta no siempre es la mejor opción cuando se extrae una cadena en bruto. Considere, en cambio, utilizar esta expresión regular hecha para esta sintaxis de fecha específica. (Fuente)

15. Coincidencia de ID de video de YouTube

/http:\/\/(?:youtu\.be\/|(?:[az◆2,3\.)?youtube\.com\/watch(?:\?|#\!)v =) ([\ w -] 11). * / gi

YouTube ha mantenido la misma estructura de URL durante años porque simplemente funciona. También es el sitio más popular para compartir videos en la web, por lo que los videos de YouTube tienden a atraer más tráfico.

Si necesita extraer una ID de video de YouTube de una URL, este código de expresión regular es perfecto y debería funcionar perfectamente para todas las variantes de las estructuras de URL de YouTube. (Fuente)

16. ISBN válido

/ \ b (?: ISBN (? ::? |))? ((?: 97 [89])? \ d 9 [\ dx]) \ b / i

Los libros impresos siguen un sistema de numeración conocido como ISBN. Esto puede ser bastante complicado cuando se consideran las diferencias entre ISBN-10 y ISBN-13..

Sin embargo, este increíble fragmento de código le permite validar un número de ISBN y verificar si es ISBN10 o 13. Todo el código está escrito en PHP, por lo que esto debería ser excepcionalmente útil para los desarrolladores web. (Fuente)

17. Compruebe el código postal

^ \ d 5 (?: [- \ s] \ d 4)? $

El creador de este fragmento no solo publicó su trabajo de forma gratuita, sino que también se tomó el tiempo para explicarlo. Encontrará este fragmento de código útil si está comparando un código postal típico de 5 dígitos o la versión más larga de 9 dígitos..

Tenga en cuenta que esto está destinado principalmente al sistema estadounidense de códigos postales, por lo que puede requerir ajustes para otros países. (Fuente)

18. Nombre de usuario válido de Twitter

/ @ ([A-Za-z0-9 _] 1,15) /

Aquí hay un fragmento de código muy pequeño para la comparación con los nombres de usuario de Twitter encontrados en una cadena. Comprueba @mencionar sintaxis que es perfecta para escanear automáticamente el contenido de un tweet (o tweets). (Fuente)

19. Números de tarjetas de crédito

^ (?: 4 [0-9] 12 (?: [0-9] 3)? | 5 [1-5] [0-9] 14 | 6 (?: 011 | 5 [ 0-9] [0-9]) [0-9] 12 | 3 [47] [0-9] 13 | 3 (?: 0 [0-5] | [68] [0-9 ]) [0-9] 11 | (?: 2131 | 1800 | 35 \ d 3) \ d 11) $

La validación de un número de tarjeta de crédito a menudo requiere una plataforma segura alojada en otro lugar en línea. Pero la expresión regular se puede usar para los requisitos mínimos de un número de tarjeta de crédito típico.

Una lista más completa de códigos para tarjetas individuales se puede encontrar aquí. Esto incluye Visa, MasterCard, Discover y muchos otros. (Fuente)

20. Encuentra los atributos CSS

^ \ s * [a-zA-Z \ -] + \ s * [:] 1 \ s [a-zA-Z0-9 \ s. #] + [;] 1

Puede ser raro ejecutar expresiones regulares sobre CSS, pero tampoco es una situación increíblemente extraña.

Este fragmento de código se puede utilizar para extraer todas las propiedades y valores de CSS coincidentes de los selectores individuales. Se puede usar por varias razones, posiblemente para ver fragmentos de CSS o para eliminar propiedades duplicadas. (Fuente)

21. Eliminar comentarios HTML

Si por cualquier motivo necesita eliminar todos los comentarios de un bloque de HTML, este es el código de expresiones regulares que debe usar. Junto con la expresión encontrarás un ejemplo de PHP usando preg_replace. (Fuente)

22. URL del perfil de Facebook

/(?:http:\/\/)?(?:www\.)?facebook\.com\/(?:(?:\w)*#!\/)?(?:pages\/)? (?: [\ w \ -] * \ /) * ([\ w \ -] *) /

Facebook es increíblemente popular y ha pasado por muchos esquemas de URL diferentes. En una situación en la que está tomando URL de perfil de los usuarios, puede ser útil analizar cadenas y confirmar que están estructuradas correctamente. Este fragmento puede hacer exactamente eso y es perfecto para todos los enlaces de estilo FB. (Fuente)

23. Compruebe la versión de Internet Explorer

^. * MSIE [5-8] (?: \. [0-9] +)? (?!. * Trident \ / [5-9] \. 0). * $

El paso de Microsoft a Edge no ha sido unánime y muchas personas aún confían en el clásico Internet Explorer. Los desarrolladores a menudo necesitan verificar las versiones de IE para manejar las inconsistencias con los motores de representación.

Este fragmento de código se puede usar en JavaScript para probar un agente de navegador según la versión de Internet Explorer (5-11) que se esté utilizando. (Fuente)

24. Extraer precio

/(\$[0-9 ,___________________________________________________________________

Los precios vienen en una variedad de formatos que contienen decimales, comas y símbolos de moneda. Esta expresión regular puede verificar todos estos formatos diferentes para obtener un precio de cualquier cadena. (Fuente)

25. Parse E-mail Header

/\b[A-Z0-9._%+-◆+@(?:[A-Z0-9-TERED+\.)+ [[]] [ES]

Con esta única línea de código, puede analizar a través de un encabezado de correo electrónico para extraer “a” Información del encabezado. Se puede utilizar en tándem con múltiples correos electrónicos unidos.

Si prefiere evitar las expresiones regulares para esta tarea, puede confiar en una biblioteca de análisis. (Fuente)

26. Unir un tipo de archivo particular

/^(.*\.(?!(htm|html|class|js)$))? icono de.html|

Cuando se trata de varios formatos de archivo, como .xml, .html y .js, puede ayudar a verificar los archivos localmente y subidos por los usuarios. Este fragmento de código extrae una extensión de archivo para verificar si es válida de una serie de extensiones válidas que se pueden cambiar según sea necesario. (Fuente)

27. Unir una cadena de URL

/[-a-zA-Z0-9@:%_\+.~#?&//=◆2,256\.[az◆2,4\b(\/[-a-zA-Z0 -9 @:% _ \ +. ~ #? & // =] *)? / Gi

Este fragmento de código se puede usar tanto para HTTPS como para cadenas HTTP para verificar si el texto coincide con la sintaxis de dominio de TLD tradicional. También hay una implementación simple de esta expresión regular utilizando RegExp de JavaScript. (Fuente)

28. Añadir rel =”no seguir” a enlaces

(] *) (href = "https?: //) ((?! (?: (?: www \.)? '. implode (' | (?: www \.)? ', $ follow_list).') ) [^ "] +)" ((?!. * \ brel =) [^>] *) (?: [^>] *)>

Si está trabajando con un lote de código HTML, puede ser espantoso aplicar trabajo manual en tareas repetitivas. Las expresiones regulares son perfectas para esta ocasión y ahorrarán mucho tiempo.

Este fragmento puede extraer todos los enlaces de anclaje de un bloque de HTML y anexar el rel =”no seguir” atribuir a cada elemento. El desarrollador que escribió este código tuvo la amabilidad de publicar la expresión en bruto más un ejemplo funcional en PHP.

29. Coincidencia de consulta de medios

/ @ media ([^ ] +) \ ([\ s \ S] +?) \ s * / g

Divida las consultas de medios CSS en sus parámetros y propiedades. Esto puede ayudarlo a analizar el CSS externo de una manera más limpia con un enfoque más directo sobre cómo funciona el código. (Fuente)

30. Sintaxis de búsqueda de Google

/([+-◆?(?:'.+?'|".+?"|[^+\-] 1 [^] *)) / g

Puede crear su propio código de expresión regular para manipular texto de búsqueda utilizando la sintaxis de marca registrada de Google. El signo más (+) denota palabras clave adicionales y el signo menos (-) denota palabras que deben ignorarse y eliminarse de los resultados.

Es un fragmento bastante complicado pero, si se usa correctamente, puede proporcionar una base para crear su propio algoritmo de búsqueda. (Fuente)

Envolver

El camino hacia el dominio de expresiones regulares es largo pero gratificante si sigues con él. Más allá de las herramientas regex típicas, la mejor manera de estudiar es a través de la repetición. Intente crear aplicaciones web que se basen en estos fragmentos de expresiones regulares para aprender cómo funcionan en una aplicación web que funciona realmente. Y si tiene otros fragmentos para sugerir, puede publicarlos en el área de comentarios a continuación..

Ahora lee:

50 fragmentos de CSS útiles que todo diseñador debería tener