Como fazer regex que aceita apenas caracteres alfanuméricos

Neste artigo você vai aprender a como criar uma regex que aceita apenas caracteres alfanuméricos, utilizando a linguagem JavaScript

Fala programador(a), beleza? Bora aprender mais sobre regex em JavaScript!

Expressões regulares (regex) são um recurso muito útil em JavaScript para validar e manipular strings.

Elas nos permitem especificar um padrão que uma string deve seguir e, em seguida, usar esse padrão para procurar ou substituir trechos da string.

Uma das coisas que muitas vezes precisamos fazer é criar uma regex que aceite apenas caracteres alfanuméricos.

Isso é útil, por exemplo, quando precisamos validar um formulário de entrada de dados e garantir que o usuário não insira caracteres especiais ou outros tipos de caracteres.

A seguir, vamos explorar algumas maneiras de fazer isso.

Usando o conjunto de caracteres [a-zA-Z0-9]

O conjunto de caracteres [a-zA-Z0-9] representa qualquer caractere alfabético ou numérico. Podemos usá-lo para criar uma regex que aceite apenas esses caracteres.

Por exemplo:

const regex = /^[a-zA-Z0-9]+$/;

console.log(regex.test('abc123')); // true
console.log(regex.test('abc123!')); // false
console.log(regex.test('abc')); // true
console.log(regex.test('123')); // true

Usando os atalhos de classe de caracteres

O JavaScript também fornece alguns atalhos de classe de caracteres que podemos usar para criar regexes que aceitam apenas caracteres alfanuméricos.

O atalho \w representa qualquer caractere alfanumérico ou o sublinhado (_).

O atalho \d representa qualquer dígito.

Podemos usar esses atalhos para criar uma regex que aceite apenas caracteres alfanuméricos da seguinte maneira:

const regex = /^\w+$/;

console.log(regex.test('abc123')); // true
console.log(regex.test('abc123!')); // false
console.log(regex.test('abc')); // true
console.log(regex.test('123')); // true

Se quisermos aceitar apenas dígitos, podemos usar o atalho \d:

const regex = /^\d+$/;

console.log(regex.test('abc123')); // false
console.log(regex.test('123')); // true
console.log(regex.test('1234567890')); // true

Usando a flag g

A flag g (global) faz com que a regex procure por todas as ocorrências de um padrão na string, em vez de parar após a primeira ocorrência.

Isso pode ser útil se quisermos substituir todos os caracteres não alfanuméricos por um caractere específico.

Por exemplo:

const str = 'abc123!@#';
const regex = /[^\w]/g;
const result = str.replace(regex, '');
console.log(result); // 'abc123'

Deixe um comentário contando o que achou deste artigo 🙂

Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:

Conclusão

No artigo de hoje você viu como fazer uma regex que aceita apenas caracteres alfanuméricos

Utilizamos diversas abordagens, e cabe a você agora decidir a melhor e implementar em seu projeto!

Está buscando a sua primeira vaga como Programador? Confira o nosso treinamento completo clicando aqui.

Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!

Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!

Subtítulo: E as letras com acento (á, ç, ã)?

Ou seja, um ‘ção’, um ‘josé’ ou um ‘maçã’ vão falhar na validação, porque á, ç e ã ficam de fora do padrão

Pra aceitar qualquer letra de qualquer idioma, o JavaScript tem os escapes de propriedade Unicode: \p{L} casa qualquer letra e \p{N} casa qualquer número

Mas tem um porém: eles só funcionam com a flag u ligada, senão nem roda

console.log(regex.test(‘joão123’)); // true console.log(regex.test(‘maçã’)); // true console.log(regex.test(‘abc123!’)); // false

Esses escapes \p{…} chegaram no ECMAScript 2018, então rodam tranquilo em ambiente atual

Tome cuidado com uma pegadinha do \w: ele NÃO é exatamente alfanumérico

Isso quer dizer que /^\w+$/ deixa passar um underscore numa string que você queria 100% alfanumérica

console.log(/^\w+$/.test(‘abc_123’)); // true (o _ passou!)

Quando gravei o vídeo de remover caracteres especiais aqui no canal, testei isso na prática e caí bem nessa pegadinha

‘olmundo’