Neste artigo você vai aprender como criar uma busca ignorando acentuação em JavaScript – utilizando recursos nativos da linguagem e de forma simples
Fala aí programador(a), beleza? Bora aprender como criar um recurso de busca com JavaScript!
A ideia principal neste conceito é utilizar uma expressão regular para remover todas as acentuações
Pois é a maneira mais fácil de trabalharmos com strings, com objetivo de manipular algo nelas
Se escolhêssemos outra abordagem como um loop for ou estruturas de condição if, o código poderia ficar muito complexo desnecessariamente e ruim de dar manutenção
A expressão regular se caracteriza pela seguinte instrução:
// sem instanciar objeto let re = /\w+/; // instanciando objeto let re = new RegExp('\\w+');
As duas abordagens terão o mesmo resultado final, porém vamos escolher a sem objeto pois é mais simples a sintaxe
Então o próximo passo é utilizar o método replace para podermos substituir todos os acentos em caracteres sem acento
Veja a função completa de como substituir caracteres especiais:
function removerSpecials(texto) { // eliminando acentuação texto = texto.replace(/[ÀÁÂÃÄÅ]/,"A"); texto = texto.replace(/[àáâãäå]/,"a"); texto = texto.replace(/[ÈÉÊË]/,"E"); texto = texto.replace(/[Ç]/,"C"); texto = texto.replace(/[ç]/,"c"); return texto.replace(/[^a-z0-9]/gi,''); } let palavras = [ 'acentuação', 'maçã', 'crachá', 'água' ]; for(let i = 0; i < palavras.length; i++) { console.log(removerSpecials(palavras[i])); }
O resultado deste array será:
"acentuacao" "maca" "cracha" "agua"
Agora podemos fazer nossos testes já na palavra sem acentuação se bate com a palavra que está na lista
Veja o exemplo completo:
function removerSpecials(texto) { // eliminando acentuação texto = texto.replace(/[ÀÁÂÃÄÅ]/,"A"); texto = texto.replace(/[àáâãäå]/,"a"); texto = texto.replace(/[ÈÉÊË]/,"E"); texto = texto.replace(/[Ç]/,"C"); texto = texto.replace(/[ç]/,"c"); return texto.replace(/[^a-z0-9]/gi,''); } let palavras = [ 'acentuação', 'maçã', 'crachá', 'água' ]; let palavraParaEncontrar = 'cracha'; for(let i = 0; i < palavras.length; i++) { if(removerSpecials(palavras[i]) === palavraParaEncontrar) { console.log(`A palavra ${palavras[i]} foi encontrada`); } }
E aqui teremos a saída:
"A palavra crachá foi encontrada"
Viu como é simples?
Conclusão
Neste artigo vimos como criar uma busca ignorando acentuação em JavaScript
O primeiro passo é remover todos os caracteres especiais via regex
Depois só precisamos fazer a comparação entre a palavra que queremos encontrar e também o conjunto de palavras que estamos buscando
Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube