1
resposta

[Dúvida] Alguém pode me ajudar a verificar se está correto?

Nas aulas em que o professor desenvolve um código para filtrar os elementos da tabela, eu encontrei uma solução diferente da que ele ensinou. Minha solução está funcional. O que eu quero é saber se o código segue as boas práticas de programação, e se tem algo que eu possa melhorar. Agradeço se alguém puder analisar:

const campoFiltro = document.getElementById("filtrar-tabela");

campoFiltro.addEventListener("input",function(){
    const listaNome = document.querySelectorAll(".info-nome");
    listaNome.forEach(function(element){
        if(!(element.textContent).toLowerCase().includes(campoFiltro.value.toLowerCase())){
            element.parentNode.classList.add("filtrado")
        }else{
            element.parentNode.classList.remove("filtrado")
        }
    })
})
1 resposta

Seu código está bom.

Apesar disso, acredito que você possa melhorar a legibilidade dele dividindo a condição do if em algumas variáveis auxiliares. Como exemplo, segue o código abaixo:

const campoFiltro = document.getElementById("filtrar-tabela");

campoFiltro.addEventListener("input", () => {
    const listaNome = document.querySelectorAll(".info-nome");
    const textoFiltro = campoFiltro.value.toLowerCase();

    listaNome.forEach(element => {
        const textoElement = element.textContent.toLowerCase();
        const elementEstaFiltrado = !textoElement.includes(textoFiltro);

        if (elementEstaFiltrado) {
            element.parentNode.classList.add("filtrado");
        } else {
            element.parentNode.classList.remove("filtrado");
        }
    });
});

Espero ter ajudado!