Solucionado (ver solução)
Solucionado
(ver solução)
19
respostas

Meu resultado não está como no da aula Java básico

Estou seguindo passo a passo as lições do curso de Java Script básico, mas continuo vendo erros no meu console.

 Uncaught TypeError: Cannot read property 'getElementsByClassName' of undefined
imprime-nome.js:4 

Uncaught TypeError: Cannot read property 'getElementsByClassName' of undefined 
calcula-ims.js:5

O erro é claro e aponta para a

var tdNome = pacienteTr.getElementsByClassName("info-nome")[0];

As minhas páginas estão aparentemente de acordo com a aula.

IMPRIME-NOME.JS

var trsPacientes = document.getElementsByClassName("paciente") // Array de tabela

percorreArray(trsPacientes, function (pacienteTr){
    var tdNome = pacienteTr.getElementsByClassName("info-nome")[0];
    var tdPeso = pacienteTr.getElementsByClassName("info-peso")[0];
    var tdAltura = pacienteTr.getElementsByClassName("info-altura")[0];

    var pacienteAtual = {nome : tdNome.textContent, 
                         peso : tdPeso.textContent, 
                         altura : tdAltura.textContent,
                         pegaImc : function(){

                                                if(this.altura != 0){

                                                var imc = this.peso / (this.altura * this.altura);
                                                return imc;

                                            } else{
                                                console("Não posso executar uma divisão por 0!");
                                            }

                         }};

    console.log(pacienteAtual.nome);

});

CALCULA-IMS.JS (sei que o nome da página foi salvo errado, mas isso não está influenciando!)


var trsPacientes = document.getElementsByClassName("paciente"); //Array de Trs

percorreArray(trsPacientes, function(pacienteTr){
    var tdNome = pacienteTr.getElementsByClassName("info-nome")[0];
    var tdPeso = pacienteTr.getElementsByClassName("info-peso")[0];
    var tdAltura = pacienteTr.getElementsByClassName("info-altura")[0];

    var pacienteAtual = {nome : tdNome.textContent, 
                         peso : tdPeso.textContent, 
                         altura : tdAltura.textContent,
                         pegaImc : function(){
                                                if(this.altura != 0){

                                                var imc = this.peso / (this.altura * this.altura);
                                                return imc;

                                            } else{

                                                console("Não posso executar uma divisão por 0!");

                                            }

                         }};


    var imc = pacienteAtual.pegaImc();

    var tdImc = paciente.Tr.getElementsByClassName("info-imc")[0];
    tdImc.textContent = imc;

    console.log(imc);    

});

PERCORRE.JS

function percorreArray(trsPacientes, comportamento){
    for (var posicaoAtual = 0; posicaoAtual <= trsPacientes.length - 1; posicaoAtual++){
    var pacienteTrAtual = trsPacientes[posicaoAtual];

        comportamento();
}
}

INDEX.HTML

<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Meus pacientes</title>
        <link rel="stylesheet" type="text/css" href="reset.css">
        <link rel="stylesheet" type="text/css" href="alura.css">
    </head>
    <body>
        <header>
            <div class="container">
                <h1>Meus pacientes</h1>
            </div>
        </header>
        <main class="container">
            <section>
                <h2>Meus pacientes</h2>
                <table>
                    <tr>
                        <th>Nome</th>
                        <th>Peso(kg)</th>
                        <th>Altura(m)</th>
                        <th>IMC</th>
                    </tr>
                    <tr class="paciente">
                        <td class="info-nome">Leonardo</td>
                        <td class="info-peso" id="peso-1">57</td>
                        <td class="info-altura" id="altura-1">1.67</td>
                        <td class="info-imc1" id="imc-1"></td>
                    </tr>
                    <tr class="paciente">
                        <td class="info-nome">Paulo</td>
                        <td class="info-peso" id="peso-2">100</td>
                        <td class="info-altura" id="altura-2">2.00</td>
                        <td class="info-imc2" id="imc-2"></td>
                    </tr>
                </table>
                <button id="calcula-imcs" class="botao ">Calcular Imcs</button>
            </section>
            <section>
                <h2>Adicionar novo paciente</h2>    
                <form>
                    <fieldset>
                        <label for="nome">Nome:</label>
                        <input id="campo-nome" type="text" placeholder="digite o nome do seu paciente">
                    </fieldset>
                    <fieldset class="campo-medio">
                        <label for="peso">Peso:</label>
                        <input id="campo-peso" type="text" placeholder="digite o peso do seu paciente">
                    </fieldset>
                    <fieldset class="campo-medio">
                        <label for="altura">Altura:</label>
                        <input id="campo-altura" type="text" placeholder="digite a altura do seu paciente">
                    </fieldset>
                    <button id="adicionar-paciente" class="botao bto-principal">Adicionar</button>
                </form>
            </section>
        </main>
        <script src="percorre.js"></script>
        <script src="calcula-ims.js"></script>
        <script src="imprime-nome.js"></script>

    </body>
</html>

Alguém consegue me ajudar? Estou achando esse módulo realmente muito difícil e complexo. As aulas passam o conteúdo muito rapidamente e está difícil fazer as associações assim. Agradeço a atenção de todos.

19 respostas
solução!

Oi bom dia, não executei seu código, mas parece que faltou passar o objeto tr para sua função comportamento.

percorreArray(trsPacientes, function (pacienteTr)

Você chama a função percorreArray passando um array e uma função de callback que recebe um objeto tr

function (pacientTr)

Mas na implementação de percorreArray vc chama essa função sem passar o objeto.

function percorreArray(trsPacientes, comportamento){
    for (var posicaoAtual = 0; posicaoAtual <= trsPacientes.length - 1; posicaoAtual++){
    var pacienteTrAtual = trsPacientes[posicaoAtual];
        comportamento(); //Aqui vc deveria chamar a função comportamento(pacienteTrAtual)
}
}

Mude sua chamada da função comportamento para:

comportamento(pacienteTrAtual)

Veja se funciona ;)

Bom dia! Eu sou completamente iniciante em Java, e não sei alguns termos com callback. De qualquer maneira, agradeço sua ajuda. Bom, mudei o comportamento conforme sugerido, mas recebi um novo erro:

calcula-ims.js:42 Uncaught SyntaxError: Unexpected token }
imprime-nome.js:24 Leonardo
imprime-nome.js:24 Paulo
adiciona.js:1 Uncaught SyntaxError: Unexpected token ILLEGAL

Estou completamente perdida!

Ah desculpa pelos termos, callback é um pedaço de código que vc passa como argumento de uma função que será que executada posteriormente, e realmente no Java não vemos esse tipo de coisa (no Java 8 sim =D).

function percorreArray(trsPacientes, comportamento)

Veja sua função percorreArray recebe um array e uma outra função (que chamei de callback).

Quanto a esse novo erro aí, da uma revisada nos parenteses e chaves, verifica se todos que abrem, fechem.

legal, Edinei, vim bisbilhotar aqui e aprendi algo novo - o callback.

Significa, então, se estivéssemos numa versão anterior do java teríamos um erro na

function percorreArray(trsPacientes, comportamento)

Este seria erro na compilação, ou apenas na execução?

Revisei e comparei os resultados com o da aula. O comportamento(); estava inclusive de acordo com o que foi passado pelo professor. Mas estranho, ainda não está funcionando. :( Obrigada pela ajuda!

Oi Sidnei, exato. Até o Java 7 não conseguimos passar um objeto Function como parâmetro e daria erro de compilação. A partir do Java 8 temos as expressões lambdas onde conseguimos um comportamento parecido com esse exemplo do javascript.

Nossa que estranho Izabela, mas não desanima, daqui a pouco outra pessoa que já conseguiu fazer esse exercício te ajuda ;) Boa sorte!!

Izabela, eu copiei os teus códigos assim como estão postados aqui. Fiz o acerto que o Edinei falou;

Além do acerto dele tem mais 2 acertos a fazer (se tu usares o código que está aqui postado)

na sua calcula-imc troca

var tdImc = paciente.Tr.getElementsByClassName("info-imc")[0];

por

var tdImc = pacienteTr.getElementsByClassName("info-imc")[0];

Tinha um ponto sobrando.

Além disto, na index.html:

troca class="info-imc1" e class="info-imc2" por class="info-imc" (ambas devem ser da mesma classe para generalizar o código...

Muito obrigada pela ajuda. Bom, segui os conselhos de vocês, mas o erro persiste:

calcula-ims.js:42 Uncaught SyntaxError: Unexpected token }
imprime-nome.js:24 Leonardo
imprime-nome.js:24 Paulo

Estranho é que a linha 42 do calcula-ims é a tag form. "/

Oi Izabela o erro na verdade está no javascript e não no html (form). Se os javascripts que vc colocou no primeiro post (percorre.js, calcula-ims.js, imprime-nome.js) não estiverem na íntegra, poste eles novamente, mas os arquivos completos.

Izabela. Eu usei o seu código.

Apenas alterei o que lhe disse acima.

E funcionou.

Se fizeres como eu disse, não tem como não funcionar.

Edinei, ela tem "erro" também no HTML, não seria bem erro. Acontece que ela quer pegar todos os elementos de uma mesma classe. E esta classe é "info-imc". Caso não seja, retorna um array vazio de onde decorrem os outros erros. Eu testei o código dela! Apenas fiz as alterações acima mencionadas: as minhas e a sua Edinei.

Edinei, os arquivos que ela postou estão completos. Apenas tem que acertar 3 coisas, nada mais.

Conforme eu disse anteriormente, eu testei. Vamos parar de pirar a cabeça da Izabela, kkkk.

Qualquer coisa, se quiserem, eu posto aqui, mas não vejo esta necessidade...

Izabela, parte do código que postaste aqui.

Faz os acertos que o Edinei e eu falamos.

GARANTO que funciona :)

Vlw Sidnei =D

Ola a discussão ta boa hein :).

@Izabela o seu erro está sendo no arquivo calcula-ims.js linha 42 porém o arquivo que você postou não tem 42 linhas, além disso o erro é bem simples Uncaught SyntaxError: Unexpected token } é um simples erro de sintaxe, você adicionou uma cheve } na linha 42 que não era esperada no script. Basta realizar as alterações do @SIDNEI e remover essa chave.

Bons estudos a todos.

Pois é, João, mas a Izabela? cadê ela?? hahahaha

Verdade, eu tinha esquecido da "}".

Com isto não tem mais erro, rs

Boa noite Isabela. Eu tive o mesmo erro que o seu nessa parte. Eu estava tendo dificuldade e peguei o código passado como resposta no exercício, porém existia um erro. Na linha do for estava faltando o -1 depois do length, além de estar lenght(). Eu vi aqui que no código passado por você que você corrigiu, mas pode ter algo disso ainda. Além disso, o outro erro é pela falta de uma chave ou por uma chave em excesso. Sugiro você utilizar outro tema no seu editor de texto que facilite a visualização disso. Boa sorte

Oi Izabela, não sei se ja resolveu seu problema, mas vai a dica: no seu arquivo IMPRIME-NOME.JS, vc declara o array de pacientes mas não termina a linha do código com ";"...Deveria ficar var trsPacientes = document.getElementsByClassName("paciente"); // Array de tabela e não var trsPacientes = document.getElementsByClassName("paciente") // Array de tabela...