Expressões Regulares
Expressões Regulares são usadas para validação de padrões sofisticados, o que pode ser útil em validação de formulários. Por exemplo, uma expressão regular pode ser usada para verificar se um endereço de email está sintaticamente correto. JavaScript permite expressões regulares compatíveis com Perl.
Existem duas maneiras de criar uma expressão regular em JavaScript: Usando a sintaxe literal var reexemplo= /padrão/; Usando o construtor RegExp() var reexemplo = new RegExp("pattern");
Considerando que o padrão que será usado é conhecido, não há vantagem real entre usar uma ou outra maneira Se o padrão a ser validado nao é conhecido de antemão (por exemplo, esse padrão será informado em um formulário), pode ser mais fácil utilizar o construtor RegExpl()
Em JavaScript existem dois métodos principais para se testar strings test() exec() exec() O método exec() pega um argumento (string), e verifica se essa string contém uma ou mais ocorrências do padrão especificado pela expressão regular. Se um ou mais padrões é encontrado, o método retorna um array de resultados com as posições iniciais das ocorrências. Se nenhuma ocorrência é encontrada, o método retorna null.
O método test() O método test() também recebe uma string como argumento e verifica se a string contém ou nao uma ocorrência especificada pela expressão regular. Ele retorna true se a string contém, ou false se nao contém. Este método é útil na validação de formulários.
Sintaxe de Expressões Regulares Uma expressão regular é um padrão que especifica uma lista de caracteres. Existem regras de sintaxe que determinam como esse padrão é especificado. Essas regras são apresentadas a seguir.
Start and End Início e Fim ( ^ $ ) Um circunflexo (^) no início de uma expressão regular indica que o padrão que está sendo buscado deve iniciar com esse padrão. O padrão ^for pode ser encontrado em "forno", porém não é encontrado em uniforme". Um sinal de cifrão ($) no final de uma expressão regular expression indica que o padrão que está sendo buscado deve terminar com esse padrão. O padrão arte$ pode ser encontrado em parte", mas nao é encontrado em artesanato.
Número de Ocorrências (? + * {} ) Os seguintes símbolos afetam o número de ocorrências do caracter precedente:?, +, *, and {}. Uma interrogação (?) indica que o caracter precedente pode aparecer zero ou uma vez no padrão O padrão foo? Pode ser encontrado em "food" e "fod", mas não em "faod". Um sinal de adição (+) indica que o caracter precedente pode aparecer uma ou mais vezes no padrão.
O padrão fo+ pode ser encontrado em "fod", "food" e "foood", mas não em "fd". Um asterisco (*) indica que o caracter precedente pode aparecer zero ou mais vezes no padrão. O padrão fo*d pode se encontrado em "fd", "fod" e "food".
Parênteses contendo um parâmetro ( {n} ) indicam que o caracter precedente pode aparecer exatamente n vezes no padrão. O padrão fo{3}d pode ser encontrado em "foood", mas não em "food" ou"fooood".
Parênteses com dois parâmetros ( {n1,n2} ) indicam que o caractere precedente deve aparecer entre n1 e n2 vezes no padrão. O padrão fo{2,4}d pode ser encontrado em "food","foood" e "fooood", mas não em "fod" ou "foooood". Parênteses contendo um parâmetro e um segundo parâmetro vazio ( {n,} ) indicam que o caractere precedente deve aparecer pelo menos n vezes no padrão. O padrão fo{2,}d pode ser encontrado em "food" e "foooood", mas não em "fod".
Caracteres Comuns (. \d \D \w \W \s \S ) Um ponto (. ) representa qualquer caracter, excet a quebra de linha. O padrão fo.d pode ser encontrado em "food", "foad", "fo9d", e "fo*d". A barra invertida seguida do caracter d ( \d ) representa qualquer dígito. É o Equivalente a [0-9]. O padrão fo\dd pode ser encontrado em "fo1d", "fo4d" e "fo0d", mas não em "food" ou "fodd".
A barra invertida seguida do caracter D ( \D ) representa qualquer caracter exceto um dígito. É o equivalente a [^0-9]. O padrão fo\dd pode ser encontrado em "food" e "foad", mas não em "fo4d". A barra invertida seguida do caracter w ( \w ) representa qualquer caracter alfanumérico (letras, dígitos e o underscore (_) ). O padrão fo\wd pode ser encontrado em "food", "fo_d" e "fo4d", mas não em "fo*d".
A barra invertida seguida do caracter W ( \W ) representa qualquer caracter excet um caracter alfanumérico O padrão fo\wd pode ser encontrado em "fo*d", "fo@d" e "fo.d", mas não em "food". A barra invertida seguida do caracter s ( \s) representa qualquer caracter de espaço (e.g, espaço, tab, quebra de linha, etc.). O padrão fo\sd pode ser encontrado em "fo d", mas não em "food".
A barra invertida seguida do caracter S ( \S ) representa qualquer caracter exceto um caracter de espaço. O padrão fo\sd pode ser encontrado em "fo*d", "food" e "fo4d", mas não em "fo d".
Grupamentos( [ ] ) Colchetes ( [ ] ) são usados para agrupar opções. O padrão f[aeiou]d pode ser encontrado em "fad" e "fed", mas não em "food", "faed" ou "fd". O padrão f[aeiou]{2}d pode ser encontrado em "faed" e "feod", mas não em "fod", "fed" ou "fd".
Negação ( ^ ) Quando usado após o primeiro caracter de uma expressão regular, o circunflexo ( ^ ) é usado para negação. O padrão f[^aeiou]d pode ser encontrado em "fqd" e "f4d", mas não em "fad" ou "fed".
Subpadrões ( () ) Parentesis ( () ) são usados para capturar subpadrões. O padrão f(oo)?d pode ser encontrado em "food" e "fd", mas não em "fod".
Alternativas ( ) A barra vertical ( ) é usada para criar padrões opcionais. O padrão foo$ ^bar pode ser encontrado em "foo" e "bar", mas não em "foobar".
Caracter de Escape ( \ ) A barra invertida (\) é usada para evitar caracteres especiais. O padrão fo\.d pode ser encontrado em "fo.d", mas não em "food" ou "fo4d".
Pré-Referências Quando queremos fazer referência a um subpadrão anterior dentro de um padrão, podemos usar pré-referências (backreferences) Elas podem ser usadas para garantir que dois subpadrões combinem. O primeiro subpadrão em um padrão é referenciado como \1, o segundo é referenciado como \2, e assim por diante
Por exemplo, o padrão ([bmpw])o\1 combina com bob, mom, pop, wow, mas não combina com bop ou pow. Analisando: [bmpw] é o primeiro subpadrão: b ou m ou p ou w o é o segundo subpadrão \1 manda que o primeiro subpadrão seja repetido
Outro exemplo seria combinar os delimitadores de números em documentos. Por exemplo, o número do seguro social americano pode ser definido com a seguinte expressão: ^\d{3}([\- ]?)\d{2}([\- ]?)\d{4}$ Analisando: ^\d{3} : precisa iniciar com uma sequência de 3 dígitos ([\- ]?): em seguida vem um hifen ou um espaço (opcional) \d{2}: em seguida uma sequência de 2 dígitos ([\- ]?): em seguida vem um hifen ou um espaço (opcional) \d{4}$: precisa finalizar com uma sequência de 4 dígitos
Expressões Válidas: 123-45-6789 123 45 6789 123456789 123-45 6789 123 45-6789 123-456789 As 3 últimas não são ideais. O ideal seria que o mesmo delimitador usado na primeira parte da expressão seja repetido.
^\d{3}([\- ]?)\d{2}\1\d{4}$ Inicia com 3 digitos Um espaço ou hífen opcional 2 digitos \1: o mesmo subpadrão usado nos primeiros () 4 dígitos para finalizar Assim, garantimos que os delimitadores são iguais
Formulários podem ser validados utilizando Expressões Regulares Exemplos: var RE_EMAIL = /^(\w+[\-\.])*\w+@(\w+\.)+[a-za-z]+$/; var RE_PASSWORD = /^[A-Za-z\d]{6,8}$/;
Analisando: ^(\w+[\-\.])*\w+@(\w+\.)+[a-za-z]+$ O início da expressão deve conter uma repetição de zero ou mais vezes da seguinte sequência: ( )* \w+[\-\.]: qualquer combinação de caracteres alfanuméricos seguida de um hifen ou ponto Após essa sequencia inical deve aparecer 1 ou mais caracteres alfanuméricos(\w+) Após essa sequencia, o caracter @
Após o @, (\w+\.)+ indica que deve vir uma sequencia de 1 ou mais caracteres alfanuméricos, seguida do. O fato da expressao estar entre ( )+ significa que esse padrão pode ser repetido 1 ou mais vezes [A-Z a-z]+ indica que podem ser inseridos apenas caracteres alfabéticos, repetidos 1 ou mais vezes. O $ indica o fim da expressão
function validate(form) { var email = form.email.value; var password = form.password.value; var errors = []; if (!RE_EMAIL.test(email)) { alert( Informe um email válido! ); } return true; }
Criar uma Expressão Regular para Senha: Uma senha válida possui entre 6 e 8 caracteres alfabéticos ou dígitos ^[A-Za-z\d]{6,8}$
Atividade Escrever Expressões Regulares para: Nome próprio Inicia com letra maiúscula Seguido por uma ou mais letras Estado Duas letras maiúsculas CPF 3 digitos seguidos de um. ou espaço Seguido por 3 digitos seguidos de um. ou espaço Seguido por 3 digitos seguidos de um - ou espaço Finaliza com 2 digitos
Login de usuário: 6 a 15 digitos alfanumericos Telefone DDD opcional entre parentesis ou apenas 2 digitos 4 digitos seguidos de um - ou espaço 4 digitos numéricos
Para pensar: A validação de CPF através de expressões regulares é suficiente para dizer se um CPF é realmente válido ou não? Existe vantagem em validar formulários através de expressões regulares?
Escrever funções para validar os campos do formulário anterior usando expressões regulares