1
resposta

Reescrevendo o código dessa aula com funções

Olá, tentei reescrever o código dessa última aula utilizando funções para separar as responsabilidades. Ficou adequado?

var campoFiltro = document.querySelector("#filtro-pacientes");

campoFiltro.addEventListener("input", function() {
    var listaTrPacientes = pegaListaTrPacientes();
    var filtroTemConteudo = verificaConteudoNoFiltro(campoFiltro);

    if (filtroTemConteudo) {
        listaTrPacientes.forEach(function(trPaciente) {
            var tdNome = trPaciente.querySelector(".info-nome").textContent;
            var valorFiltro = campoFiltro.value;

            var filtroIgualTdNome = comparaValorFiltroComValorNome(valorFiltro, tdNome);
            if (filtroIgualTdNome) {
                trPaciente.classList.add("invisivel");
            } else {
                trPaciente.classList.remove("invisivel");
            }

        });
    }
     if (!filtroTemConteudo) {
         listaTrPacientes.forEach(function(trPaciente) {
             trPaciente.classList.remove("invisivel");
         })
     }


});



function pegaListaTrPacientes() {
    var listaTrPacientes = document.querySelectorAll(".paciente");
    return listaTrPacientes;

}

function verificaConteudoNoFiltro(campo) {
    if (campo.value.length > 0) {
        return true;
    } else {
        return false;
    }
}

function comparaValorFiltroComValorNome(valorFiltro, valorTd) {
    if (valorFiltro != valorTd) {
        return true;
    } else {
        return false;
    }

}
1 resposta

Bom dia!

Sua separação ficou boa! Fica melhor construído o código.

Só a sugestão, nos seus 'if' de verificaConteudoNoFiltro e comparaValorFiltroComValorNome, retire as chaves.

Não tem necessidade, pois o íf' só tem um comando dentro.

Bons estudos!