Uma expressão entre colchetes representa uma classe de caracteres. Por exemplo, [abc]
significa "a letra a, ou a letra b ou a letra c" (apenas uma delas).
Se retirar os colchetes (abc
) aí significa "a letra a seguida da letra b, seguida da letra c" (as 3 letras nesta ordem).
E se tiver um ^
dentro dos colchetes, significa que está negando o que tem dentro. Ou seja, [^abc]
significa "qualquer coisa que não seja a letra a, nem a letra b, nem a letra c".
Já \w
é um atalho para [a-zA-Z0-9_]
, ou seja, "qualquer letra maiúscula, minúscula, dígitos ou _
".
Portanto, [^\w]
significa "qualquer caractere que não seja \w
", e por isso que a expressão está pegando também o caractere <
(veja aqui um exemplo desta regex funcionando).
E [\w@\w]
seria "um \w
, ou o caractere @
ou um \w
". Pois é, o \w
aparece duas vezes dentro dos colchetes, o que é redundante.
No seu caso específico você só quer o que está <
e >
, então você poderia usar apenas os próprios caracteres <
e >
. Não precisa usar \w
, pois você já sabe exatamente quais são os delimitadores (<
e >
), então use especificamente estes caracteres.
Entre eles você poderia usar .+
que significa "uma ou mais ocorrências de qualquer caractere". .*
também funcionaria, mas o *
significa "zero ou mais ocorrências", o que faria aceitar a string <>
.
Então a regex ficaria <(.+)>
:
<
e >
representam os próprios caracteres <
e >
.+
é "uma ou mais ocorrências de qualquer caractere"
- os parênteses servem para definir um grupo de captura, para que seja possível obter o trecho correspondente com o método
match
O código fica assim:
let texto = "teste <[email protected]>";
let email = texto.match(/<(.+)>/)[1];
console.log(email);
Ganância
O problema dos quantificadores +
e *
é que eles são gananciosos e tentam pegar o maior número possível de caracteres. No seu caso específico não faz diferença, mas caso você tenha mais de um par de <
e >
, o resultado pode ser inesperado:
O trecho capturado será [email protected]> outro <[email protected]
: o quantificador +
pega o maior trecho possível que satisfaça a regex. Como eu usei .+
, ele vai pegar a maior quantidade possível de qualquer caractere, até achar um >
(ele acha o primeiro, mas como tem outro depois, ele continua). Por isso ele acaba pegando mais do que "devia".
Neste caso, basta cancelar a ganância colocando um ?
na frente:
Com isso, o email capturado passa a ser somente "[email protected]".
Sobre o uso de regex para validar emails
Mas se entre <
e >
sempre vai ter um email, talvez a regex deva ser mais específica, assim você evita os "falso-positivos" (obter uma string que está entre <
e >
mas não é um email). Só que aí ela começa a ficar complicada demais (veja este exemplo, só para ter uma ideia). Mas pelo menos você garante que só vai ter dados válidos (evitando strings como "<123>"
- supondo que você só vai aceitar endereços de email).
Só precisa ver se vale a pena ter uma regex tão complexa (pense na manutenção futura deste código). Quem sabe uma alternativa seja ter algo intermediário, como <([^<>]+)>
(<
, seguido de uma ou mais ocorrências de qualquer coisa que não seja <
nem >
, seguido de >
).
Ou até mesmo uma regex mais "ingênua", como <([\w.-]+@[a-z.]+)>
(uma ou mais ocorrências de \w
, ponto ou traço, seguido de @
, seguido de uma ou mais ocorrências de letras ou ponto) - ela aceita endereços de email, mas também aceita coisas como <.@gmail.>
. Mas pelo menos não aceita <123>
(que é algo que .+
aceitaria, por exemplo).
Enfim, não tem muito jeito, quanto mais específica, menor a chance de falsos-positivos, mas maior a complexidade.
PS: Eu também comento mais sobre o uso de regex para validar emails nesta resposta, e nesta outra também.