O regex que mais me custou tempo foi um que EU não escrevi Tinha quatro anos, estava sentado em uma camada de validação, e parecia que um gato tinha atravessado o teclado: grupos aninhados, um lookahead, duas classes de personagens, e um {2,} escondendo-se no final Um ticket de suporte dizia que estava rejeitando a entrada válida, e antes que EU pudesse corrigi-la EU tinha que entendê-la, o que significava executar mentalmente o motor sobre o padrão um token de cada vez Esse é o imposto que todo desenvolvedor paga sobre um regex desconhecido, e é exatamente o imposto o Explicador Regex no Toolz.dev é construído para remover Este guia é sobre a leitura de expressões regulares em vez de decodificá-las, e como uma quebra token-by-token transforma uma parede de símbolos em algo que você pode rever como código comum.
tl;dr: Um explicador regex analisa uma expressão regular e descreve cada parte em inglês simples, na ordem em que o mecanismo a lê: âncoras, classes de caracteres, quantificadores, grupos, lookarounds e fugas, todos rotulados e recuados de modo que a estrutura aninhada seja visível Explicador Regex valida o padrão com o mecanismo JavaScript real e faz toda a análise do seu navegador, sem nada carregado.
O que é um explicador regex?
Um explicador regex pega uma expressão regular e a traduz, uma construção de cada vez, em uma descrição que você pode ler Em vez de olhar para ^(?<user>[a-z0-9._%+-]+)@ e reconstruindo seu significado em sua cabeça, você obtém uma lista ordenada: esta é uma âncora de início de string, este é um grupo de captura nomeado chamado usuário, esta é uma classe de caracteres que corresponde a uma letra minúscula, um dígito, um ponto, um sinal de porcentagem, um sinal de mais ou um hífen, e este quantificador significa uma ou mais vezes O padrão não mudou, mas o esforço de entendê-lo passou de sua cabeça para a ferramenta.
O valor vem do fato de que expressões regulares são deliberadamente compactas Todo símbolo carrega significado, e a mesma intenção pode ser escrita de muitas maneiras diferentes, então não há uma maneira confiável de deslizar um padrão da maneira que você desliza uma função Uma única barra invertida perdida muda um ponto literal em & quot; qualquer caractere, & quot; e um quantificador ganancioso onde você queria um preguiçoso muda qual texto um grupo captura Ler um regex corretamente significa simular o motor, e simular o motor à mão é lento e propenso a erros O explicador faz essa simulação e mostra o resultado.
Em Toolz.dev o fluxo é curto Você cola o padrão sem suas barras circundantes, alterna as bandeiras que ele usa, e a quebra aparece imediatamente Grupos aninhados são recuados para que a forma do padrão seja visível de relance, e cada bandeira é descrita no contexto para que você entenda como ele muda toda a correspondência, em vez de apenas a sintaxe.
Como um explicador é diferente de um testador regex?
Estas duas ferramentas respondem a perguntas diferentes, e saber de que precisa poupa tempo Um testador regex executa um padrão contra texto de amostra e mostra o que corresponde: as correspondências destacadas, os grupos de captura e qualquer erro Ele responde & quot; este padrão faz o que EU quero nesta entrada." Um explicador descreve o que o padrão significa sem qualquer entrada de teste em tudo Ele responde & quot; o que é que este padrão realmente diz."
Você alcança o explicador quando o regex é o desconhecido, não os dados Revisando uma solicitação pull que adiciona um padrão de validação, herdando uma base de código cheia de expressões não documentadas ou tentando entender uma resposta que você copiou de um fórum são todos os casos em que você tem o padrão e precisa saber o que ele faz antes de confiar nele Você alcança o testador regex quando você já entende o padrão e quer confirmar seu comportamento contra exemplos reais Na prática os dois trabalham como um par: explique um padrão para entendê-lo, depois teste-o para provar isso O testador e o explicador sentam-se um ao lado do outro em Toolz.dev exatamente por esse motivo.
Há uma terceira ferramenta na família que vale a pena nomear O Construtor Regex monta um padrão a partir de componentes e modelos quando você está começando do zero Construir, explicar, testar: esses três cobrem todo o ciclo de vida de trabalhar com uma expressão regular, desde escrever uma que você ainda não tem até entender uma que você não escreveu.
O que o detalhamento realmente mostra?
O explicador percorre o padrão da esquerda para a direita e emite uma linha rotulada por construção, na ordem em que o mecanismo os encontra. Essa ordenação é importante, porque uma expressão regular é lida sequencialmente, e ver os tokens em sequência reflete como a correspondência realmente ocorre.
As âncoras vêm em primeiro lugar na maioria dos padrões. O ^ e $ os símbolos não correspondem aos caracteres; eles afirmam uma posição, o início e o fim da string, ou o início e o fim de cada linha quando a bandeira multilinha é definida O explicador observa esse comportamento duplo, então você nunca é surpreendido por uma âncora que se comporta de maneira diferente sob o m bandeira.
As classes de caracteres, escritas entre colchetes, descrevem um único caractere extraído de um conjunto O explicador expande o conjunto em palavras: intervalos como a-z torne-se & quot; o intervalo a a z, & quot; escapa abreviada como \d torne-se & quot; um dígito, & quot; e um caret líder torna-se o & quot; qualquer carácter que seja NOT" o conjunto listado Uma classe densa como [a-zA-Z0-9._%+-] lê como uma lista simples em vez de um quebra-cabeça.
Quantificadores são onde bugs sutis vivem, então eles obtêm suas próprias linhas A * é zero ou mais, + é um ou mais, ? é zero ou um, e {n,m} é um intervalo explícito. Crucialmente, o explicador sinaliza quantificadores preguiçosos, aqueles escritos com um arrasto ? tais como +? ou *?, porque a diferença entre mudanças gananciosas e preguiçosas que um padrão captura de texto sem alterar um único caractere visível em outro lugar.
Grupos e lookarounds são recuados para mostrar aninhamento Grupos de captura, grupos não-capturadores, grupos nomeados e todos os quatro tipos de lookaround cada obter uma descrição do que eles fazem, eo padrão filho dentro deles é recuado um nível para que a estrutura lê como um contorno aninhado, em vez de uma série plana de símbolos.
Veja como as construções comuns mapeiam o que o explicador lhe diz:
| Construir | exemplo | O que o explicador diz |
|---|---|---|
| Âncora | ^ |
Início da corda (ou início de uma linha com a bandeira m) |
| classe de personagem | [a-z] |
Um único caractere do intervalo a a z |
| Taquigrafia | \d |
Um dígito, 0 a 9 |
| Quantificador | {2,} |
Repetido 2 ou mais vezes |
| Quantificador preguiçoso | +? |
Repetido uma ou mais vezes, o menor número possível |
| Grupo de captura | (...) |
Início de um grupo de captura, guardado para reutilização |
| Grupo nomeado | (?<id>...) |
Início de um grupo de captura nomeado & quot;id" |
| Olha, cabeça | (?=...) |
O padrão fechado deve seguir, mas não é consumido |
| Retro-referência | \1 |
Corresponde ao mesmo grupo de texto 1 capturado |
As descrições seguem a terminologia usada no Referência de expressões regulares MDN, portanto, se você quiser ler mais sobre qualquer construção, as palavras no detalhamento são as palavras a serem pesquisadas.
Por que o sabor importa?
Expressões regulares não são uma linguagem; elas são uma família de outras intimamente relacionadas JavaScript, PCRE (usado pelo PHP e muitas ferramentas), Python' s re module, Java e .NET compartilham a sintaxe principal, mas divergem nas bordas, e essas bordas são onde a confusão se gera O Explicativo Regex descreve expressões regulares JavaScript, o sabor usado por navegadores e Node.js, porque é contra isso que a ferramenta valida e o que a maioria dos desenvolvedores web realmente executa.
O núcleo compartilhado é grande e confiável Classes de caracteres, os quantificadores comuns, alternância com |, agrupamento, âncoras e taquigrafias padrão \d e \w significa a mesma coisa em todos os lugares Se o seu padrão usa apenas aqueles, a explicação é precisa, independentemente da linguagem em que você irá eventualmente executá-lo As divergências estão nos recursos avançados: suporte lookbehind chegou tarde em JavaScript e difere do PCRE, sintaxe de grupo nomeado varia entre sabores, e alguns motores suportam recursão ou quantificadores possessivos que JavaScript não tem em tudo.
A regra prática é simples Trate a explicação das construções compartilhadas como autoritativa, e verifique novamente qualquer extensão específica de sabor contra a documentação para sua linguagem de destino Como o explicador valida o padrão com o mecanismo JavaScript real primeiro, uma construção que o JavaScript não suporta virá à tona como um erro, em vez de uma explicação errada, que é a falha mais segura Se você estiver trabalhando através da pilha da maneira que EU faço, movendo-se entre um back-end PHP e um frontend JavaScript, ser explícito sobre o sabor salva a classe de bug onde um padrão que funcionava em um lugar silenciosamente se comporta mal em outro.
Como leio um padrão real com ele?
Pegue a amostra que a ferramenta carrega por padrão, um padrão em forma de e-mail: ^(?<user>[a-z0-9._%+-]+)@(?<domain>[a-z0-9.-]+\.[a-z]{2,})$ com a bandeira insensível ao caso Por si só, é um bocado Execute-o através do explicador e ele se decompõe em um contorno curto e legível.
o ^ afirma o início da string O primeiro grupo nomeado, usuário, captura um ou mais caracteres de uma classe de letras minúsculas, dígitos e a pontuação comumente permitida na parte local de um endereço Então um literal @. O segundo grupo nomeado, domínio, captura uma ou mais letras, dígitos, pontos ou hífens, seguido por um ponto literal e uma sequência de duas ou mais letras, que é o domínio de nível superior. Finalmente $ afirma o fim da corda O i flag significa que a coisa toda corresponde independentemente do caso, portanto, as classes minúsculas ainda aceitam entrada maiúscula.
Leia dessa forma, saltam duas coisas que são invisíveis no padrão bruto Primeiro, o {2,} no domínio de nível superior significa que o padrão aceita qualquer TLD de duas ou mais letras, o que é correto para domínios modernos, mas rejeitaria um TLD internacionalizado escrito em caracteres não latinos Segundo, as âncoras significam que o padrão deve corresponder a toda a string, por isso valida um endereço inteiro em vez de encontrar um dentro de um texto maior Esses são exatamente os tipos de detalhes que determinam se um regex de validação é muito rigoroso ou muito solto, e eles são óbvios na quebra, sendo fáceis de perder no original.
Depois de entender um padrão, muitas vezes você deseja fazer algo com ele Se for um padrão de encontrar e substituir, o Regex Substituir ferramenta executa a substituição com suporte de backreference Se for um padrão de extração, o Extrator E-mail aplica uma versão com curadoria exatamente desse tipo de correspondência de e-mail ao texto em massa O explicador é a etapa de leitura; estas são as etapas de atuação.
Quando é que EU iria realmente usar isto?
Revisão de código é o caso que EU mais acertei Um companheiro de equipe adiciona uma expressão regular a uma camada de validação ou um analisador de log, e o diff mostra uma linha de símbolos sem nenhum comentário Colá-lo no explicador transforma um olhar de cinco minutos em uma leitura de dez segundos, e ele pega o clássico erro de revisão: um ponto não escapado que corresponde a qualquer personagem, um quantificador ganancioso que captura demais, uma âncora que está presente ou ausente quando deveria ser o outro caminho Comecei a colar o detalhamento na solicitação pull como um comentário, que documenta o padrão para a próxima pessoa gratuitamente.
Aprender é o próximo Expressões regulares são uma daquelas habilidades que nunca ficam totalmente a menos que você as use diariamente, e voltar a elas depois de alguns meses sempre significa reaprender a sintaxe Ler padrões reais com o explicador é um caminho mais rápido de volta do que reler um tutorial, porque você vê as construções no contexto, fazendo um trabalho real, em vez de como exemplos isolados Com o tempo as descrições se tornam desnecessárias porque você as internalizou, que é o ponto.
A depuração fecha o loop Quando um padrão corresponde à coisa errada, a explicação geralmente revela por que antes mesmo de você procurar a entrada de teste Um quantificador que é ganancioso quando deveria ser preguiçoso, uma classe de caracteres que inclui um caractere que você esqueceu, uma âncora ausente que permite que o padrão corresponda a uma substring: todos estes são visíveis no detalhamento Eu mantenho o explicador ao lado do testador regex então posso explicar e testar na mesma sessão, e ambos moram no kit mais amplo que descrevi no Guia do kit de ferramentas para desenvolvedores web.
É privado e funciona offline?
Sim a ambos, e pela mesma razão Toda a quebra é computada em JavaScript dentro do seu navegador O padrão nunca é enviado para um servidor, nada é registrado, e uma vez que a página tenha carregado a ferramenta continua trabalhando com sua conexão desativada Você pode confirmar isso abrindo a guia de rede ou ficando offline e observando-a continuar a funcionar.
Isso importa mais do que pode parecer para expressões regulares especificamente Os padrões são frequentemente escritos para corresponder a formatos confidenciais: identificadores internos, formas de chave de API, layouts de número de conta ou a estrutura de dados privados Colar um desses em uma ferramenta do lado do servidor significa entregar uma descrição do seu formato de dados a terceiros Manter a análise do lado do cliente significa que o padrão permanece em sua máquina, que é o mesmo princípio de privacidade por trás de cada ferramenta no Toolz.dev, e uma que escrevi mais completamente no Guia de privacidade de dados.
FAQ
Como entendo uma expressão regular complexa?
Cole o padrão no explicador e leia a análise token-by-token, que descreve cada construção em inglês simples na ordem em que o mecanismo o aplica. Os grupos aninhados são recuados para que você possa ver a estrutura. Isso transforma a simulação mental do mecanismo em simplesmente ler uma lista rotulada, que é mais rápida e muito menos propensa a erros.
Qual é a diferença entre um explicador regex e um testador regex?
Um explicador regex descreve o que um padrão significa sem qualquer entrada de teste, enquanto um testador regex executa o padrão contra texto de amostra e mostra o que ele corresponde Use o explicador para entender ou documentar um padrão desconhecido, em seguida, use o testador para confirmar que ele se comporta como esperado contra dados reais Eles respondem a perguntas diferentes e funcionam bem como um par.
Qual o sabor do regex que o explicador descreve?
Ele descreve expressões regulares JavaScript (ECMAScript), o sabor usado por navegadores e Node.js. A maioria da sintaxe, incluindo classes de caracteres, quantificadores, grupos e âncoras, é compartilhada com PCRE, Python e Java, portanto, a explicação principal é precisa em todos os idiomas. Recursos específicos de sabor, como lookbehind e sintaxe de grupo nomeado, podem ser diferentes, portanto, verifique aqueles em relação ao seu idioma de destino.
Qual é a diferença entre um quantificador ganancioso e preguiçoso?
Um quantificador ganancioso como + ou * corresponde ao máximo de texto possível antes de retroceder, enquanto um quantificador preguiçoso, o mesmo símbolo seguido por ? como +? ou *?, corresponde o mínimo possível O explicador rotula quantificadores preguiçosos explicitamente, porque a diferença muda qual texto um padrão captura sem alterar nenhum caractere visível em outro lugar.
O explicador pode lidar com o lookhead e o lookhind?
Sim. Olhar para frente positivo e negativo, escrito (?=...) e (?!...), e olhar para trás positivo e negativo, escrito (?<=...) e (?<!...), cada um é rotulado com o que afirma e é recuado como outros grupos. Os olhares verificam se o texto aparece ou não em uma posição sem incluí-lo na partida, o que as descrições explicitam.
Por que o explicador diz que meu padrão é inválido?
O padrão é compilado com o mecanismo RegExp real antes de ser explicado, portanto, um colchete ou parêntese desequilibrado, um escape inválido ou um sinalizador desconhecido é relatado com a mensagem de erro exata do mecanismo & #39; Corrigir o problema relatado, na maioria das vezes um parêntese ou colchete de fechamento ausente, e o detalhamento aparecerá.
É seguro colar um regex que corresponda aos dados privados?
Sim. O padrão é analisado inteiramente em JavaScript dentro do seu navegador Nunca é enviado para um servidor, nunca registrado, e a ferramenta funciona com sua conexão desativada após o carregamento da página Você pode explicar com segurança padrões de bases de código privadas ou que correspondam a formatos pessoais ou proprietários.
Como isso é diferente de um construtor regex?
Um construtor regex ajuda você a construir um novo padrão a partir de componentes e modelos quando você está começando do zero, enquanto o explicador descreve um padrão que você já tem Os dois são complementares: construir um padrão com o Regex Builder, entender um existente com o explicador, e confirmar qualquer um contra entrada real com o Regex Tester.
Leia seus próprios padrões gratuitamente Explicador Regex. Ele divide uma expressão regular token por token em inglês simples, inteiramente no seu navegador, sem nada carregado.
